Advanced Search

Return to Snippet

Revision: 21260
at December 8, 2009 08:09 by neal_grosskopf
Initial Code 
$(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);
Initial URL 
http://www.nealgrosskopf.com/tech/thread.php?pid=61
Initial Description 
Internet Explorer does not support a standards compliant way to create text shadows. Learn how to emulate the CSS3 feature with this jQuery plugin.
Initial Title 
A jQuery Plugin To Create CSS3 Text-Shadows In Internet Explorer
Initial Tags 
css, ie, jquery, CSS3
Initial Language 
jQuery