function run_smallgallery(){ var boxshadow = $('#boxshadow'); var box = $('#box'); var imgloader = $('#imgloader'); var boximg = $('#boximg'); var imgs = $('#gallerysmall img'); var bord = $('#border'); var wrap = $('#wrapper'); var alink = $('#gallerysmall a').add('.lightbox'); $(window).bind("resize", function(){ boxshadow.css({ //затененный фон попапа тянем по ширине и высоте height: wrap.height(), width: $(window).width() }); box.css('left', (wrap.width()/2) - (box.width()/2)); //центруем попап }); $(window).resize(); imgs.mouseover(function (){ var pos = $(this).position(); var w = $(this).width() - 8; var h = $(this).height() - 8; if ($.browser.msie && ($.browser.version == 6 || $.browser.version == 7)) { w = w + 4; h = h + 4; } $(this).css('opacity', 1); $(this).after(bord); bord.css({ //показываем бордер у рисунка при наведении left: pos.left, top: pos.top, width: w, height: h, display: 'block' }); }); bord.mouseout(function (){ bord.prev().css('opacity', '0.6'); bord.css('display', 'none'); }); alink.click(function (){ if ($('.lightbox').length){ var img = $(this).children().attr('src'); img = img.replace('_thumb', ''); } else { var img = $(this).attr('href'); } boxshadow.css({ display: 'block', height: $('body').height() + 99 }); boxshadow.animate({opacity: 0.4}, 200, function (){ var x = wrap.width()/2 - box.width()/2; var y = $(window).scrollTop() + 100; box.css({ left: x, top: y, display: 'block' }); imgloader.css('display', 'block'); boximg.attr('src', img); boximg.load(function(){ x = wrap.width()/2 - $(this).width()/2; box.css({ left: x, width: boximg.width(), height: boximg.height() }); imgloader.css('display', 'none'); boximg.css('visibility', 'visible'); }); }); bord.css('display', 'none'); bord.prev().css('opacity', '0.6'); return false; }); $('#close').add(boxshadow).click(function (){ hideBox(); }); function hideBox(){ box.css({ width: 200 + 'px', height: 200 + 'px', display: 'none' }); boximg.css('visibility', 'hidden'); boxshadow.animate({opacity: 0}, 200, function (){ $(this).css('display', 'none'); }); } }