Tagged: , ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • February 28, 2018 at 3:48 pm #919115
    elenapoliti

    Hi I have 3 images that should work as buttons. By clicking each one a specific section should show (by default they are not displayed) and the window should scroll at the beggining of the section (which has a unique id).

    I tried with the following code:

    function show_section(){
?>
<script>
jQuery(window).load(function(){
jQuery( "#section" ).hide();
jQuery( ".image" ).click(function() {
jQuery( "#section" ).toggle();
});
});
</script>
<?php
}
add_action('wp_footer', 'show_section');

    This works fine, but the window does not scroll down to the section. How can I adjust the code in order to add the scrolling to the anchor text?

    Thabk you very much

    February 28, 2018 at 6:12 pm #919206
    elenapoliti

    I found the answer: just added the following script to the functions.php file (if somebody else is interested)

    function show_section(){
?>

<script>
jQuery(document).ready(function( $ ) {
	$(".image").click(function(){
		if ($('#section').css('display') == 'none') 
		{
			$("#section").css("display","block");
		}
		else
		{
			$("#section").css("display","none");
		}
		document.getElementById('diecimetri').scrollIntoView(true);	
	});
});
</script>
<?php
}
add_action('wp_footer', 'show_section');

    and then I added a css rule as follows

    #section {
display:none;
}
    March 1, 2018 at 7:38 am #919429
    Rikard

    Hi,

    Great, glad you found a solution and thanks for sharing :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    March 2, 2018 at 6:56 pm #920482
    elenapoliti

    Yes please close it

    March 2, 2018 at 7:15 pm #920496
    Jordan Shannon

    Hi,

    If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘toggle sections by clicking an image and sliding down to anchor text’ is closed to new replies.