/** * Popup Image Gallery (PIG) v1.03 * Requirements: jquery.js,v 1.6 2006/12/23 21:46:35 * How to use: * 1. load this script and jquery.js on a page * 2. make that:

{all content here}

* 3. set class="popup" for needed images in html * 4. click on this images for view results * * Script also support thumb.php, where image URL like "path/thumb.php?filename=path_to_image&size=..." * Author: Andrey Sapegin, http://www.andreysapegin.com, dear@andreysapegin.com **/ function popup_preview(img) { // turn off all flashes (for performance) $("object").css("visibility", "hidden"); $("embed").css("visibility", "hidden"); // at first time if ($('#popup_bg').length == 0) { $("body").prepend("

"); $("body").prepend("

"); $('#popup_bg').fadeTo(1, 0, function () { $('#popup_bg').css("background-color", "#000"); $('#popup_bg').css("display", "block"); $('#popup_bg').css("position", "absolute"); $('#popup_bg').css("top", "0"); $('#popup_bg').css("left", "0"); $('#popup_bg').css("z-index", "50"); $('#popup_bg').css("cursor", "pointer"); $('#popup_img').css("display", "block"); $('#popup_img').css("position", "absolute"); $('#popup_img').css("z-index", "51"); $('#popup_img').css("color", "#666"); $('#popup_img').css("text-align", "center"); $('#popup_img').css("cursor", "pointer"); }); } // calc size of background shadow if ( $("#popup_container").height() == null ) { $('#popup_bg').height( $("html").height() + "px" ); // stupid IE :( } else { $('#popup_bg').height( $("#popup_container").height() + "px" ); // stupid IE :( } if ($.browser.msie) { $('#popup_bg').width( $("html").width() - 21 + "px" ); $('#popup_img').width( $("html").width() - 21 + "px" ); } else { $('#popup_bg').width( $("html").width() + "px" ); $('#popup_img').width( $("html").width() + "px" ); } // position of image var obj = img.offsetParent; offsetTop = img.offsetTop + obj.offsetTop; while (obj != null && obj.tagName != "BODY") { lastOffset = obj.offsetTop offsetTop += lastOffset; obj = obj.offsetParent; } offsetTop -= lastOffset; // waiting for loading... $('#popup_img').css( "top", "-5000px"); //top + "px" ); $('#popup_bg').fadeTo("slow", 0.6, function () { popup_show_img(img, offsetTop); }); } function popup_show_img(img, offsetTop) { // thump.php here pattern = /.*filename=([^&]*)&size.*/; var src = $(img).attr('src').match(pattern); if (src != null && src.length>1) src = src[1]; else src = $(img).attr('src'); // show image $('#popup_img').css( "top", offsetTop + "px" ); $("#popup_img").html('

Загрузка изображения...

'); $("#popup_img").append(' '+ ($(img).attr('alt')!=null ? $(img).attr('alt') :

'+ ($(img).attr('alt')!=null ? $(img).attr('alt') :

'); $("#popup_img img").load( function () { $("#popup_img p").remove(); $('#popup_img img').css('padding', '1px'); $('#popup_img img').css('background-color', '#666'); $('#popup_img img').css('color', '#000'); $('#popup_img img').css('border', '20px solid #fff'); $('#popup_img img').css('cursor', 'pointer'); $('#popup_img img').css('visibility', 'visible'); if ( $('#popup_bg').css('display') == 'none' ) { $('#popup_img').html(''); } else { // now we show image, but opened image may be larger than we think before var top = offsetTop - $("#popup_img img").height(); top = (top < 150) ? 150 : top; $('#popup_img').css( "top", top + "px" ); if ( $('#popup_bg').height() < ($('#popup_img').height() + top) ) $('#popup_bg').height( $('#popup_img').height() + top + "px" ); if ( $('#popup_bg').height() < $('html').height() ) $('#popup_bg').height( $('html').height() + "px" ); } }); } function popup_hide() { $('#popup_img').html(''); $('#popup_bg').fadeTo("slow", 0, function () { $('#popup_bg').hide() $('#popup_img').html(''); // turn on all flashes $("object").css("visibility", "visible"); $("embed").css("visibility", "visible"); }); } // onload startup $(function () { $("img.popup").each( function(i) { $(this).click(function () { popup_preview(this) }); $(this).css('cursor', 'pointer'); }); }); /* More Description ------------------------------------------------------------------ */ var More_description = { init: function() { this.setDescription(); }, setDescription: function() { show_height = 45; speed = 200; desc = jQuery('#more'); if (desc.height() > show_height+50) { desc.orig_height = desc.height() + 20; desc.css({'overflow': 'hidden', 'height': show_height+'px'}); desc.after('

Развернуть

'); jQuery('.more_description a').bind('click', function(e) { e.preventDefault(); if (desc.orig_height > desc.height()) { desc.animate({'height': desc.orig_height+'px'}, speed); // desc.css({'cssText': 'overflow: visible !important'}); jQuery(this).html('Свернуть'); } else { desc.css({'overflow': 'hidden'}); desc.animate({'height': show_height+'px'}, speed); jQuery(this).html('Развернуть'); } }); } } };