<html>
<head>
<title>Magic Magnify Plus: Blur and transparency</title>
<!-- link to magicmagnifyplus.css file -->
<link rel="stylesheet" href="magicmagnifyplus/magicmagnifyplus.css" type="text/css" media="screen, projection"/>
<!-- link to magicmagnifyplus/magicmagnifyplus.js file -->
<script src="magicmagnifyplus/magicmagnifyplus.js" type="text/javascript"></script>
</head>
<body>
<p class="note">NOTE: The click to enlarge feature only works when this page is served from localhost or a webserver (<a href="http://demo.magictoolbox.com/magicmagnifyplus/example9.html">view this example online</a>).</p>
<div class="w50">
<p>Blurred background</p>
<p><a href="images/shoe_large.jpg" class="MagicMagnifyPlus" rel="blur:5"><img src="images/shoe_small.jpg"/></a></p><br/>
</div>
<div class="w50">
<p>40% transparency</p>
<p><a href="images/shoe_large.jpg" class="MagicMagnifyPlus" rel="transparency:40%"><img src="images/shoe_small.jpg"/></a></p><br/>
</div>
<div class="clear"> </div>
</body>
</html>