-1

i have implemented serialscroll for one of my website

now i want to highlight current element/image being scrolled and for rest of the images i want to make opacity 70%

is it possible in Serialscroll plugin

thanks in advance

1 Answers1

0

Got the solution

here is the scenario, im using serial scroll for one of my website and i want to highlight current element/image with opacity of 1 and rest should have opacity of 0.5

to do this here is a simple tweak to your init.js file

var $nav = $('.picture_holder img');

$('#gallery').serialScroll({
        items:'td',
        prev:'#btn-prev',
        next:'#btn-next',
        offset:-300, //when scrolling to photo, stop 230 before reaching it (from the left)
        start:0, //as we are centering it, start at the 2nd
        duration:1200,
        force:true,
        stop:true,
        lock:false,
        cycle:false, //don't pull back once you reach the end
        easing:'easeOutQuart', //use this easing equation for a funny effect
        jump: true,//click on the images to scroll to them
        navigation:$nav,
onBefore:function(e,el,$p,$i,pos){
$nav.css('opacity','0.5');
$nav.eq(pos).css('opacity','1')},
    });