|
Opacity options
joesnet mobilejoe
Opacity reduced to 25%, background opacity 70%:
Reverse opacity zoom mode, background opacity 30%:
Here's the code:
<html>
<head>
<title>Magic Zoom Plus: Opacity options</title>
<!-- link to magiczoomplus.css file -->
<link href="magiczoomplus/magiczoomplus.css" rel="stylesheet" type="text/css" media="screen"/>
<!-- link to magiczoomplus.js file -->
<script src="magiczoomplus/magiczoomplus.js" type="text/javascript"></script>
</head>
<body>
<p>Opacity reduced to 25%, background opacity 70%:</p>
<!-- define Magic Zoom Plus with square opacity of 25% -->
<a href="images/harley1c.jpg" class="MagicZoomPlus" rel="opacity:25; zoom-height:200;background-opacity: 70"><img src="images/harley1b.jpg"/></a>
<p>Reverse opacity zoom mode, background opacity 30%:</p>
<!-- define Magic Zoom Plus with reverse opacity option enabled -->
<a href="images/harley2c.jpg" class="MagicZoomPlus" rel="opacity-reverse:true; zoom-height:200;background-opacity: 30"><img src="images/harley2b.jpg"/></a>
</body>
</html>
|