modify jquery nivo zoom plugin to achieve a new behavior -
thanks reading. trying modify jquery nivo zoom plugin make close previous clicked images.
you can see current behavior here: http://nivozoom.dev7studios.com/
now plugin open large image when clicking on thumbnail keeping previous clicked opened. said i'd modify close previous clicked images.
looking code think should add in part of code, here:
function dozoom(img, link, nivozoomhover){ var imglarge = $('img.nivolarge', link); if(link.hasclass('zoomed')){ //hide overlay if(settings.overlay) $('#nivooverlay').fadeout(settings.speed/2); //hide caption if($('.nivocaption', link).length > 0){ $('.nivocaption', link).fadeout(settings.speed/2); } //hide image imglarge.fadeout(settings.speed/2, function(){ img.animate({ opacity:1 }, settings.speed/2); }); link.removeclass('zoomed'); } else { //show overlay if(settings.overlay) $('#nivooverlay').fadein(settings.speed/2); //hide zoomhover nivozoomhover.css('opacity','0'); //show image img.animate({ opacity:0 }, settings.speed/2, function(){ imglarge.fadein(settings.speed/2, function(){ showcaption(img, imglarge, link); }); }); link.addclass('zoomed'); } }
but tried stuff , didn't work now. can ?
thank much.
around line #67 - after 'link.bind('click', function(){'
paste following:
var notthis = $(".nivocaption").not($(".nivocaption", link)); notthis.closest("a").removeclass("zoomed"); notthis.removeclass("nivo-processed"); notthis.css("display","none"); notthis.parent().children("img").not($("img.nivolarge")).css("opacity","1"); $(".nivolarge").not($("img.nivolarge", link)).fadeout(settings.speed/2);
there's better way, seems work.
what's going nag @ next ie9 z-index issue of zoomed images appearing behind zoomed thumbnails. go line #185 or , find 'ie7 fix' , comment 3 line function out. "fix" breaks z-index in ie9. (but you're going resurrect issue ie7, oh well).
Comments
Post a Comment