javascript - Using Fade Scroll jQuery-effect on 2-column floated gallery -

http://jsfiddle.net/mqhes/23/so found neat jquery, fade scroll code here: change opacity based on elements current offset. noticed works in 1 column. if 1 has 2 columns floated items, items in left column effected function (see jsfiddle). have solution this?

http://jsfiddle.net/mqhes/23/

html:

<img src="http://lorempixel.com/640/480/food/1" /> <img src="http://lorempixel.com/640/480/food/2" /> <img src="http://lorempixel.com/640/480/food/3" /> <img src="http://lorempixel.com/640/480/food/4" /> <img src="http://lorempixel.com/640/480/food/5" /> <img src="http://lorempixel.com/640/480/food/6" /> <img src="http://lorempixel.com/640/480/food/7" /> <img src="http://lorempixel.com/640/480/food/8" /> <img src="http://lorempixel.com/640/480/food/9" /> <img src="http://lorempixel.com/640/480/food/10" /> 

css:

img {width: auto; max-width: 50%; height: auto; float: left;} img {display:block; margin: 10px auto} 

js:

    var $win = $(window); var $img = $('img');  $win.scroll( function () {     var scrolltop = $win.scrolltop();      $img.each(function () {         var $self = $(this);         var prev=$self.prev().offset();         if(prev){             var pt=0;             pt=prev.top;                 $self.css({                 opacity: (scrolltop-pt)/ ($self.offset().top-pt)             });         }         else{             $self.css({                 opacity: 1             });         }       });  }).scroll(); 

change
var prev=$self.prev().offset();
to
var prev=$self.prev().prev().offset();

jsfiddle