function(trigger,action,config){var $target = jQuery( this ),
offset = $target.offset(),
target_w = $target.outerWidth(),
target_h = $target.outerHeight(),
$element = $target;
if ( config.id ) {
$element = jQuery( "#tcb-image-zoom-" + config.id + " img" )
} else if ( $element.find( "img" ).length ) {
$element = $element.find( "img" )
}
var image_src = $element.attr( "src" ),
$lightbox = jQuery( '#tve_zoom_lightbox' ),
$overlay = jQuery( '#tve_zoom_overlay' ),
windowWidth = window.innerWidth,
windowHeight = window.innerHeight,
img_size = $element.data( "tve-zoom-clone" ),
resizeScale = windowWidth < 600 ? 0.8 : 0.9;
if ( typeof img_size === 'undefined' ) {
var $clone = $element.clone()
.css( {
position: "absolute",
width: "",
height: "",
left: "-8000px",
top: "-8000px"
} ).removeAttr( "width height" );
$clone.appendTo( "body" );
$clone.on( 'load', function () {
img_size = {
"originalWidth": $clone.width(),
"width": $clone.width(),
"originalHeight": $clone.height(),
"height": $clone.height()
};
if ( img_size.originalWidth > windowWidth * resizeScale || img_size.originalHeight > windowHeight * resizeScale ) {
var widthPercent = img_size.originalWidth / windowWidth,
heightPercent = img_size.originalHeight / windowHeight;
img_size.width = ((widthPercent > heightPercent) ? (windowWidth * resizeScale) : (windowHeight * resizeScale * (img_size.originalWidth / img_size.originalHeight)));
img_size.height = ((widthPercent > heightPercent) ? (windowWidth * resizeScale * (img_size.originalHeight / img_size.originalWidth)) : (windowHeight * resizeScale));
}
$element.data( "tve-zoom-clone", img_size );
show_lightbox();
} );
} else {
show_lightbox();
}
function show_lightbox() {
if ( $lightbox.length ) {
$lightbox.show();
} else {
$lightbox = jQuery( "
" )
.appendTo( 'body' );
$overlay = jQuery( "" ).hide()
.appendTo( 'body' );
var tve_close_lb = function () {
$lightbox.hide();
$overlay.hide();
};
/* set listeners for closing the lightbox */
jQuery( document ).on( "click", ".tve_close_lb", tve_close_lb );
jQuery( document ).on( "click", "#tve_zoom_overlay", tve_close_lb );
jQuery( document ).on( "keyup", function ( e ) {
if ( e.keyCode == 27 ) {
tve_close_lb();
}
} );
jQuery( window ).resize( function () {
var _sizes = $lightbox.data( "data-sizes" ),
windowWidth = window.innerWidth,
windowHeight = window.innerHeight,
resizeScale = windowWidth < 600 ? 0.8 : 0.9;
if ( _sizes.originalWidth > windowWidth * resizeScale || _sizes.originalHeight > windowHeight * resizeScale ) {
var widthPercent = _sizes.originalWidth / windowWidth,
heightPercent = _sizes.originalHeight / windowHeight;
_sizes.width = ((widthPercent > heightPercent) ? (windowWidth * resizeScale) : (windowHeight * resizeScale * (_sizes.originalWidth / _sizes.originalHeight)));
_sizes.height = ((widthPercent > heightPercent) ? (windowWidth * resizeScale * (_sizes.originalHeight / _sizes.originalWidth)) : (windowHeight * resizeScale));
}
$lightbox.width( _sizes.width );
$lightbox.height( _sizes.height );
$lightbox.css( "margin-left", - (_sizes.width + 30) / 2 );
$lightbox.css( "margin-top", - (_sizes.height + 30) / 2 );
} );
}
$lightbox.data( "data-sizes", img_size );
jQuery( "#tve_zoom_image_content" ).html( "" );
$lightbox.css( {
left: offset.left + target_w / 2,
top: offset.top + target_h / 2,
marginLeft: 0,
marginTop: 0,
width: 0,
height: 0,
opacity: 0
} ).animate( {
opacity: 1,
left: '50%',
top: '50%',
marginLeft: - (img_size.width + 30) / 2,
marginTop: - (img_size.height + 30) / 2,
width: img_size.width,
height: img_size.height
}, 150 );
$overlay.fadeIn( 150 );
}
return false;}