Fix code with jqzoom, innerHTML and javascript:void(0);
I am using jqzoom script (from http://www.mind-projects.it/projects/jqzoom/ ) in my page.
When you enter my website you can see the jqzoom workinf fine.
But I have a dropdown menu that when people clicks it changes a div with small images and a large image. The small images should call the jqzoom... the div changes OK but the calling to the jqzoom does nothing...
Here is my code:
I canīt find the problem. Can anyone help me, please?
<select name="id[1]" onchange="mostrar_capa(this.value);"><option value="1">Azul - Sin stock</option><option value="15">Gris - Sin stock</option></select>
<script src="jqzoom_ev-2.3/js/jquery.jqzoom-core.js" type="text/javascript"></script>
<link rel="stylesheet" href="jqzoom_ev-2.3/css/jquery.jqzoom.css" type="text/css">
<style type"text/css">
:focus { outline: none; }
*{margin:0;padding:0;}
blockquote, dd, dt{margin:0 0 8px 0;line-height:1.5em;}
fieldset {padding:0px;padding-left:7px;padding-right:7px;padding-bottom:7px;}
fieldset legend{margin-left:15px;padding-left:3px;padding-right:3px;color:#333;}
dl dd{margin:0px;}
dl dt{}
.clearfix:after{clear:both;content:".";display:block;font-size:0;height:0;line-height:0;visibility:hidden;}
.clearfix{display:block;zoom:1}
ul#thumblist{display:block;}
ul#thumblist li{float:left;margin-right:2px;list-style:none;}
ul#thumblist li a{display:block;border:1px solid #CCC;}
ul#thumblist li a.zoomThumbActive{
border:1px solid red;
}
.jqzoom{
text-decoration:none;
float:left;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('.jqzoom').jqzoom({
zoomType: 'standard',
lens:true,
preloadImages: false,
alwaysOn:false,
xOffset: 20,
yOffset: 20
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$('.jqzoom1').jqzoom({
zoomType: 'standard',
lens:true,
preloadImages: false,
alwaysOn:false,
xOffset: 20,
yOffset: 20
});
});
</script>
<style>
.jqzoom1{
text-decoration:none;
float:left;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('.jqzoom2').jqzoom({
zoomType: 'standard',
lens:true,
preloadImages: false,
alwaysOn:false,
xOffset: 20,
yOffset: 20
});
});
</script>
<style>
.jqzoom2{
text-decoration:none;
float:left;
}
</style>
<script type="text/javascript">
function mostrar_capa (quecapa){
if (quecapa == 1) {
document.getElementById('contenido_capas').innerHTML = ' <div class="clearfix"><a href="fotos_productos/dsc_5556a.jpg" class="jqzoom1" rel=\'gal1\' title="Caofi" ><img src="fotos_productos/dsc_5556a.jpg" title="Caofi" width="230" height="267" border="0" title="triumph" style="border: 4px solid #666;"></a></div><div class="clearfix" ><ul id="thumblist" class="clearfix" ><li><a class="zoomThumbActive" href=\'javascript :void(0);\' rel="{gallery: \'gal1\', smallimage: \'fotos_productos/dsc_5556a.jpg\',largeimage: \'fotos_productos/dsc_5556a.jpg\'}"><img src="fotos_productos/dsc_5556a.jpg" id="mainpic" name="mainpic" width="67" height="67"/></a></li><li><a href="javascript :void(0);" title="Caofi #2" rel="{gallery: \'gal1\', smallimage: \'fotos_productos/dsc_5549a.jpg\',largeimage: \'fotos_productos/dsc_5549a.jpg\'}"><img src="fotos_productos/dsc_5549a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li><li><a href="javascript :void(0);" title="Caofi #3" rel="{gallery: \'gal1\', smallimage: \'fotos_productos/dsc_5550a.jpg\',largeimage: \'fotos_productos/dsc_5550a.jpg\'}"><img src="fotos_productos/dsc_5550a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li><li><a href="javascript :void(0);" title="Caofi #4" rel="{gallery: \'gal1\', smallimage: \'fotos_productos/dsc_5551a.jpg\',largeimage: \'fotos_productos/dsc_5551a.jpg\'}"><img src="fotos_productos/dsc_5551a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li></ul></div>';
}if (quecapa == 15) {
document.getElementById('contenido_capas').innerHTML = ' <div class="clearfix"><a href="fotos_productos/dsc_5548a.jpg" class="jqzoom2" rel=\'gal2\' title="Caofi" ><img src="fotos_productos/dsc_5548a.jpg" title="Caofi" width="230" height="267" border="0" title="triumph" style="border: 4px solid #666;"></a></div><div class="clearfix" ><ul id="thumblist" class="clearfix" ><li><a class="zoomThumbActive" href=\'javascript :void(0);\' rel="{gallery: \'gal2\', smallimage: \'fotos_productos/dsc_5548a.jpg\',largeimage: \'fotos_productos/dsc_5548a.jpg\'}"><img src="fotos_productos/dsc_5548a.jpg" id="mainpic" name="mainpic" width="67" height="67"/></a></li><li><a href="javascript :void(0);" title="Caofi #2" rel="{gallery: \'gal2\', smallimage: \'fotos_productos/dsc_5542a.jpg\',largeimage: \'fotos_productos/dsc_5542a.jpg\'}"><img src="fotos_productos/dsc_5542a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li><li><a href="javascript :void(0);" title="Caofi #3" rel="{gallery: \'gal2\', smallimage: \'fotos_productos/dsc_5544a.jpg\',largeimage: \'fotos_productos/dsc_5544a.jpg\'}"><img src="fotos_productos/dsc_5544a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li></ul></div>';
}
}
</script>
<div id="contenido_capas" name="contenido_capas" style="width:235px;">
<div class="clearfix"><a href="fotos_productos/dsc_5556a.jpg" class="jqzoom1" rel='gal1' title="Caofi" ><img src="fotos_productos/dsc_5556a.jpg" title="Caofi" width="230" height="267" border="0" title="triumph" style="border: 4px solid #666;"></a></div><div class="clearfix" ><ul id="thumblist" class="clearfix" ><li><a class="zoomThumbActive" href='javascript :void(0);' rel="{gallery: 'gal1', smallimage: 'fotos_productos/dsc_5556a.jpg',largeimage: 'fotos_productos/dsc_5556a.jpg'}"><img src="fotos_productos/dsc_5556a.jpg" id="mainpic" name="mainpic" width="67" height="67"/></a></li><li><a href="javascript :void(0);" title="Caofi #2" rel="{gallery: 'gal1', smallimage: 'fotos_productos/dsc_5549a.jpg',largeimage: 'fotos_productos/dsc_5549a.jpg'}"><img src="fotos_productos/dsc_5549a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li><li><a href="javascript :void(0);" title="Caofi #3" rel="{gallery: 'gal1', smallimage: 'fotos_productos/dsc_5550a.jpg',largeimage: 'fotos_productos/dsc_5550a.jpg'}"><img src="fotos_productos/dsc_5550a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li><li><a href="javascript :void(0);" title="Caofi #4" rel="{gallery: 'gal1', smallimage: 'fotos_productos/dsc_5551a.jpg',largeimage: 'fotos_productos/dsc_5551a.jpg'}"><img src="fotos_productos/dsc_5551a.jpg" border="0" width="67" height="67" style="width:67px;height:67px;" ></a></li></div>
Thread Information
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Tags for this Thread
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Bookmarks