Cross browser shadows css3

by Nikolaenko Maxim · Published July 31, 2013 · Updated August 7, 2018

For the second time on my blog I turn to the article of the site www.recens.ru, the resource always writes about important and necessary things. Today I want to introduce you a plugin from the author of the site for creating text shadows. text-shadow в IE7.

First, download the plugin:

Plugin for creating shadows in IE7

Plugin call:

$('.block').textShadow('0 1px #191919'); // без размытия	
$('.block').textShadow('1px 1px 5px #191919'); // с размытием

1 2	$('.block').textShadow('0 1px #191919'); // без размытия $('.block').textShadow('1px 1px 5px #191919'); // с размытием

The parameter listing is the same., as in property text-shadow, with the only difference, that the shadow color should be the last parameter.

The plugin is pretty simple., if interested, read, how it works on the author's website.

Browsers, who support text-shadow, output these examples with CSS, a IE will use the above plugin.

To differentiate between browsers IE from others you can use CSS hacks. Plugin example:

<!--[if IE]><script type="text/javascript" src="text-shadow.jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('.block').textShadow('1px 1px #191919');
	})
</script><![endif]-->

<!--[if IE]><script type="text/javascript" src="text-shadow.jquery.js"></script>

$(document).ready(function(){

$('.block').textShadow('1px 1px #191919');

})

</script><![endif]-->

All other browsers will treat this text as a normal comment., and only IE will load the required plugin.
Learn more about conditional comments for IE you can read In here.

Good luck in cross-browser layout of sites.

Online tutoring services. List of courses I teach

Basic web design course;
Site layout;
General course on CMS WordPress and continuation of the course on template development;
Website development in PHP.