jQuery help needed ( bxSlider )

I am doing a latest items slider.

demo here

Instructions on the page of what I want to achieve. But essentially.

  1. display the 3 slide results.

  2. slide down so that top result hidden until slide down finished.

  3. then display new top slide result

To explain, lets say the slider slides down, and displays results vertically down like 3,2,1
Then the slider slides down, 1 is now hidden. Result 2 is where 1 was , result 3 is where 2 was. And the top position is opacity:0 until the slide movement finished, then slide 4 is displayed ( opacity 1 )

Then it continues. Kinda hard to exaplin, so posted a link on that page too that shows exactly what I am trying to acheieve,


I haven’t used this slider before but I just looked at documentation and these options might help you.

To change slide direction: autoDirection: ‘next’ (default) or ‘prev’ (this will reverse the order and slide down the items)

To slide 3 items, use: minSlides: 3 and maxSlides: 3 and moveSlides: 3

For the last one you will have to play with callbacks: onSlideBefore and onSlideAfter

Hope this helps

Cheers will have another Bash. I looked at Next and Prev and thought… nah must be horizontal lol. But makes sense :slight_smile:
The oNslideBefore and After I tried, but with no real luck, will see if changin other parameters affects that.