Activate Magnetic slide via seperate link

Walker

Hey Armin,

I have a Project with an Magnetic Slider (vertical by scrolling) which includes just two slides.The first slide is a Carousel and the second one includes just text. On top of the Carousel Slider I have a button which is called "information". When you click it you should activate the Magnetic Slide-movement and go automatically down to the information/second slide of the Magnetic Slider.
It would be exactly be like a "scroll to bottom" Button.

I couldn´t manage to do it.  Maybe it`s easy for you.

My Website is rothsimon.de/wp2

Would be very nice thanks a lot

arminunruh

Add a class to your "information" textelement called "godown" (without ""). You can do that by hovering over your button in the gridder and clicking the class button.

Then in lay options -> Custom CSS & HTML -> Custom <head> content add:

jQuery("body").on("click", ".godown", function(){
jQuery.fn.fullpage.moveSectionDown();
})

Let me know if that works.

You probably want to hide that button for mobile because magnetic slides might not be active for mobile.
In lay options -> Custom CSS & HTML -> Custom CSS for Mobile Version add:

.godown{display:none;}

Walker

Hi Armin,

thanks a lot for the answer.
I added the class to the textfield and the jquery to the head,
unfortunately nothing happened. The Textfield with "information"
not even bahave like a button. It is not clickable.
Do you habe a clue what could be wrong?

Thanks

arminunruh

Ahw yea, I made a little mistake. It should work like this:

in lay options -> Custom CSS & HTML -> Custom <head> content add:

<script>
jQuery(document).ready(function(){
    jQuery("body").on("click", ".godown", function(){
        jQuery.fn.fullpage.moveSectionDown();
    }); 
});
</script>

In lay options -> Custom CSS & HTML -> Custom CSS for Desktop Version add:

.godown{
    cursor: pointer;
}

Walker

Hey Armin,

thanks for the new reply,
perfect, this works out.

thanks for your help.

Lay Theme Forum

Activate Magnetic slide via seperate link

Before you post:

When you post:

Online Users