Here in code a free java-script is available
,you can modify it also as your need.
Here is given many JavaScripts like:
<script
type="text/javascript">
$("#zoom_03").elevateZoom({
gallery: 'gallery_01', cursor:
'pointer', galleryActiveClass:
'active' });
</script>
<script type="text/javascript">
//pass the images to Fancybox
$("#zoom_03").bind("click",
function (e) {
var ez = $('#zoom_03').data('elevateZoom');
$.fancybox(ez.getGalleryList());
return false;
});
</script>
<script type="text/javascript">
$("
#zoom_01").elevateZoom();
</script>
<script type="text/javascript">
$("#zoom_04a").elevateZoom({
zoomWindowPosition: 1 });
$("#zoom_04b").elevateZoom({
zoomWindowPosition: 12 });
$("#zoom_04c").elevateZoom({
zoomWindowPosition: "demo-container",
zoomWindowHeight: 200, zoomWindowWidth: 200, borderSize: 0, easing:
true });
$("#zoom_04d").elevateZoom({
zoomWindowPosition: 1, zoomWindowOffetx: 10 });</script>
<script type="text/javascript">
$("#zoom_05").elevateZoom({
zoomType:
"inner",
cursor:
"crosshair"
});</script>
<script type="text/javascript">
$("#zoom_08").elevateZoom({
zoomWindowFadeIn:
500,
zoomWindowFadeOut:
500,
lensFadeIn: 500,
lensFadeOut: 500
});
</script>
<script type="text/javascript">
$("#zoom_09").elevateZoom({
gallery:
"gallery_09",
galleryActiveClass: "active"
});
</script>
See the attached code for better
understanding.