I'd like to create a single tall page which has 4 sections. However, a single image will sit in the center of the page and everything else will scroll up as you scroll down (I hope that makes sense)...
LayerSlider is not a page builder so unforunately there is no dedicated option available to create such page layouts.
But I believe you could achieve something similar by creating 4 separate sliders, positioning them under each other, this would represent the 4 sections. After that you could set up 4 global backgrounds for the sliders and set the background behavior for fixed. This will create a similar scrolling effect you're looking for. The single image at the mid could be only a regular image on top of the sliders.
Alternatively you could also use just 1 fullsized slider and merge the 4 sections into 1 slider background with the same fixed background behavior. After that you could create the middle image as a layer.
Hey! Thanks for the reply. Okay, so which would you suggest - I need to ensure this is responsive and works on any screensize - which method will adapt best?
I believe the second method I recommended would be easier to achieve. However the first one is closer to what you're looking for, although positioning 4 sliders could be more complicated.
I don't know if I made this point and I should have - some animations will need to be triggered as the user scrolls down the page... Is that achievable?
Sorry for all the questions I forgot to ask in the first place!
Okay I think I've sussed the best way to achieve this - with your Play By Scroll function. This way I can leave the Hero image on every side with no animation, and everything else just animates upwards when you scroll the mouse-wheel.
However, I have noticed this function is a little unstable on iPad - have you noticed this? It took me a few LONG swipes up to force the next slide to open on the iPad, in your demo here: https://layerslider.kreaturamedia.com/sliders/play-by-scroll/
Sure but I'm having other issues with this right now. I'm creating a new slideshow animation based on your Scroll Wheel demo template, and for some reason, halfway through editing it, the layers have flipped - so the layers that used to be at the bottom are now at the top... They've completely reversed order. How did this happen!?
Unfortunately not, you can only navigate through the slider which is using the play by scroll feature with scrolling. Keyboard buttons and scrollbar are not available for this purpose currently.
We are planning to improve the play by scroll feature in the upcoming releases. I will also forward your ideas to the developers, so they can consider including these additions in future updates.
Thanks :) It's an amazing pluig, by the way - I'm very impressed with it, despite some minor issues. I'll remember to rate it properly after my project goes live.
Hi there
I'd like to create a single tall page which has 4 sections. However, a single image will sit in the center of the page and everything else will scroll up as you scroll down (I hope that makes sense)...
Can this be achieved with your plugin?
Kind regards
Matt
Hey Matt,
LayerSlider is not a page builder so unforunately there is no dedicated option available to create such page layouts.
But I believe you could achieve something similar by creating 4 separate sliders, positioning them under each other, this would represent the 4 sections. After that you could set up 4 global backgrounds for the sliders and set the background behavior for fixed. This will create a similar scrolling effect you're looking for. The single image at the mid could be only a regular image on top of the sliders.
Alternatively you could also use just 1 fullsized slider and merge the 4 sections into 1 slider background with the same fixed background behavior. After that you could create the middle image as a layer.
Hey! Thanks for the reply. Okay, so which would you suggest - I need to ensure this is responsive and works on any screensize - which method will adapt best?
I believe the second method I recommended would be easier to achieve. However the first one is closer to what you're looking for, although positioning 4 sliders could be more complicated.
Hi Attila
I don't know if I made this point and I should have - some animations will need to be triggered as the user scrolls down the page... Is that achievable?
Sorry for all the questions I forgot to ask in the first place!
Sorry, ignore me - found it :)
Hi Attila
Okay I think I've sussed the best way to achieve this - with your Play By Scroll function. This way I can leave the Hero image on every side with no animation, and everything else just animates upwards when you scroll the mouse-wheel.
However, I have noticed this function is a little unstable on iPad - have you noticed this? It took me a few LONG swipes up to force the next slide to open on the iPad, in your demo here: https://layerslider.kreaturamedia.com/sliders/play-by-scroll/
Matt
We did not experience this problem on our end with the play by scroll feature, and no other user reported it so far either.
Could you please specify on which model/browser are you experiencing this exactly, so we can troubleshoot and test it further ?
Hi Attila
Sure but I'm having other issues with this right now. I'm creating a new slideshow animation based on your Scroll Wheel demo template, and for some reason, halfway through editing it, the layers have flipped - so the layers that used to be at the bottom are now at the top... They've completely reversed order. How did this happen!?
That is strange, this shouldn't happen under normal circumstances, but it could be a result of a script error.
If you can set up a temporary WP login for us we will take a look at it to see if we can find anything.
Hi,
Well, I had to revert to a previous revision in the end so there's nothing to see now.
Cheers
Attila, with this method using ScrollWheel, is there a way to use Scrollwheel AND keyboard, AND scrollBAR as well, to cycle through slides?
Unfortunately not, you can only navigate through the slider which is using the play by scroll feature with scrolling. Keyboard buttons and scrollbar are not available for this purpose currently.
Understood. What are the implications of adding that functionality, do you think?
We are planning to improve the play by scroll feature in the upcoming releases. I will also forward your ideas to the developers, so they can consider including these additions in future updates.
Thanks :) It's an amazing pluig, by the way - I'm very impressed with it, despite some minor issues. I'll remember to rate it properly after my project goes live.
Thank you for your feedback and kind words.