jquery.blurryTransition demo

Directions

Create a list of images and initiate the javascript.

Example

<ul id="slideshow">
  <li><img src="someimage_1.jpg"></li>
  <li><img src="someimage_2.jpg"></li>
  <li><img src="someimage_3.jpg"></li>
</ul>
<script type="text/javascript">
  $(function() {
    $('#slideshow').blurryTransition({width:'100%', height:'100%'});
  });
</script>
    

Default Settings

$('.my_frame').magnifyingFrame({
  'interval' : 12000,
    /* interval between image shifts */
  'css_transition_speed' : '0.7s',
    /* speed of blurring transition */
  'width' : null,
  'height' : null
    /* optional, but must be declared if the value is a percentage */
});