Scroll to specific object on click
-
Hi !
I've been using Lay Theme since a bit, and I'm currently trying to push a little further my website.
I basically try to create a scroll to specific object on lick function (combining with the click events, to have scroll on click with all objects with a specific class)
I've been looking at the guidelines in the "custom script" documentation section, especially the "Binding Click Events", but I tried and seems that it's not working (nothing in the log when clicking...)
How could we apply that short simple code ? (combining the click events with a scroll to function)<script>
$("button").click(function() {
$('html,body').animate({
scrollTop: $(".second").offset().top},
'slow');
});
</script>Thank you very much!
Thibault
-
Hey thibault, you are binding your click event directly to an element. But you need to bind it in a delegated way like i explain in the documentation:
<script>
jQuery("body").on("click", "button", function(event) {
console.log("yay!");
});
</script>This code will console log yay everytime you click a dom element "button". If u want to bind the click to an element that has the class button you should use ".button" instead of "button"
-
Hey! I tried exactly with the code you suggested in the documentation
<script>
jQuery("body").on("click", ".clickme", function(event) {
console.log("yay!");
});
</script>and gave a class clickme to an image (with the little class button)
But nothing appears in the log when I click on it... it's in a project page, I'm using arrows (previous/next) on that page also. The mouse pointer doesn't change, and nothing appears in the logs... I tried on a clickable object (a button) still nothing.What do you think that could be ? I tried the other script you suggested in the doc Newpage Events, and some stuffs appear in the log that time.
Thnks !
-
Hey can u send me your laytheme website address and wordpress login please? You can send that via chat or email to: armin.unruh@gmail.com
Please also provide a link to this forum thread so that I remember what the problem is. -
I actually just solved it ! I entered the scripts in the Top and not in the Head now it's working fine ! Thanks
-
@ThibaultDuchesne
Hey Thibault:
could you explain how you made it happen?
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it