In HEAD-Section:

<style type="text/css">

.magnifyarea{ /* CSS to add shadow to magnified image. Optional */
box-shadow: 3px 3px 5px #3a3a3a;
-webkit-box-shadow: 3px 3px 5px #3a3a3a;
-moz-box-shadow: 3px 3px 5px #3a3a3a;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
background: white;

//<--dieses style-css kann auch weg gelassen werden.

}

</style>

 

<script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript" src="imagezoomer.js">

/***********************************************
* Featured Image Zoomer (w/ adjustable power)- By Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>





__________________________________________________________________________________________________
Fr anzuzeigende Bilder in HEAD-Section einfgen


<script type="text/javascript">

jQuery(document).ready(function($){

	$('#image1').addimagezoom({
		zoomrange: [3, 10],
		magnifiersize: [500,400],
		magnifierpos: 'left',
		largeimage: 'image1.jpg' //<-- No comma after last option!
	})
})

</script>


</script>

<script type="text/javascript">

jQuery(document).ready(function($){

	$('#image2').addimagezoom({
		zoomrange: [3, 10],
		magnifiersize: [500,400],
		magnifierpos: 'left',
		largeimage: 'image2.jpg' //<-- No comma after last option!
	})
})

</script>


</script>

<script type="text/javascript">

jQuery(document).ready(function($){

	$('#image3').addimagezoom({
		zoomrange: [3, 10],
		magnifiersize: [500,400],
		magnifierpos: 'left',
		largeimage: 'image3.jpg' //<-- No comma after last option!
	})
})

</script>

_________________________________________________________________________________________________
In BODYSection(oder Direct-HTML-Objekt) einfgen

<p><img id="image1" border="1" src="thumbnail1.jpg" style="width:300px;height:225px" /><p>


