Posted By

neal_grosskopf on 12/08/09

Tagged

Versions (?)

Last Edited at 12/08/09 08:09am

Statistics

Viewed 1246 times

Favorited by 3 user(s)

Related snippets

A jQuery Plugin To Create CSS3 Text-Shadows In Internet Explorer

/ Published in: jQuery

Internet Explorer does not support a standards compliant way to create text shadows. Learn how to emulate the CSS3 feature with this jQuery plugin.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

$(document).ready(function(){
	$(".shadow-me").textShadow("#000",1,1);
});
 
 
(function ($) {
$.fn.textShadow = function(shadowcolor,x,y) {
return this.each(function(i){
var parent = "tsw-" + Math.floor(Math.random()*100000);
 
//Create container
$(this).wrap('<div class="text-shadow-wrapper" id="' + parent + '"></div>');
 
//Set height of container so that it properly overflows
$("#" + parent).css("height", $(this).css("font-size")); //Math.abs()??
 
//Add text-shadow class to initial element
$(this).addClass("text-shadow");
 
//Adds shadow HTML element
$(this).before('<span class="shadow">' + $(this).text() + '</span>');
 
//Positions shadow HTML element
$("#" + parent + " .shadow").css({left: x, top: y, color: shadowcolor});
});
};
})(jQuery);