Oh no! Where's the JavaScript?
Your Web browser does not have JavaScript enabled or does not support JavaScript. Please enable JavaScript on your Web browser to properly view this Web site, or upgrade to a Web browser that does support JavaScript.
Articles

image zoom tests

64 image zoom tests

test about pictures in NEWS and ARTICLE and how to zoom them
with html image, anchor, js...



only HTML image tag ( here can use your browser "VIEW IMAGE" function on right click )
<img src='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' style='margin:5px' alt='' width='120' />




use link ( here you can click on the image )
<a href='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' target='_blank'><br /> <img src='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' style='margin:5px' alt='' width='120' /></a>




use script (jquery.elevatezoom.js) from

// image zoom in function.php function get_footer() of theme itune
add_to_head ("");
and in article use
<img id='zoom_01' src='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' style='margin:5px' alt='' width='120' data-zoom-image='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' />
or only
<img id='zoom_01' src='https://engineering-news.org/kllfusion01/downloads/ARLE0001.GIF' style='margin:5px' alt='' width='120' />
$('#zoom_01').elevateZoom();
with a different number for each image!


$('#zoom_01').elevateZoom();
$('#zoom_02').elevateZoom();


use script (jquery.prettyPhoto.js) from

// image zoom in function.php function get_footer() of theme itune
add_to_head ("<br /> <xmp>media='screen' title='prettyPhoto main stylesheet' charset='utf-8' />
");
and in article use



$(document).ready(function(){
$("area[rel^='prettyPhoto']").prettyPhoto();

$(".gallery:first a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'normal',theme:'light_square',slideshow:3000, autoplay_slideshow: true});
$(".gallery:gt(0) a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'fast',slideshow:10000, hideflash: true});

$("#custom_content a[rel^='prettyPhoto']:first").prettyPhoto({
custom_markup: '
',
changepicturecallback: function(){ initialize(); }
});

$("#custom_content a[rel^='prettyPhoto']:last").prettyPhoto({
custom_markup: '
',
changepicturecallback: function(){ _bsap.exec(); }
});
});



kll January 18 2014 27 reads Print
Sign In
Not a member yet? Click here to register.
Forgot Password?
Users Online Now
Guests Online 1
Members Online 0

Total Members: 1
Newest Member: kll