Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • April 22, 2020 at 8:58 am #1206073
    Skylla-Lametta

    Hi there,
    unfortunately I have a little problem with the logo size in my layout.
    My website is setup with a split menu and a logo which overlaps onto the slider beneath. That works fine.
    Now I would like the logo – while scrolling down the page – to shrink and become so small to fit into the header completely.

    You can have a look at the website via the data in the private content field.
    Thank you very much in advance!

    April 22, 2020 at 9:35 am #1206084
    Yigit

    Hey,

    Thanks for contacting us!

    I added following code to Functions.php file of your child theme

    
function add_decrease_logo(){
?>
<script>
jQuery(window).scroll(function(){
if(jQuery(this).scrollTop() > 200) {
		jQuery('.logo img').addClass('decreased');
	} else {
		jQuery('.logo img').removeClass('decreased');
	}
});
</script>
<?php
}
add_action('wp_footer', 'add_decrease_logo');

    Then added following code to Style.css file of your child theme

    .logo img.decreased { 
	min-height: auto; 
	max-height: 50px; 
}

    Please review your website.

    Best regards,
    Yigit

    April 22, 2020 at 11:14 am #1206139
    Skylla-Lametta

    Hi Yigit,
    thank you so much for your help!
    This is exactly the effect I was looking for. Brilliant!

    April 22, 2020 at 11:23 am #1206142
    Skylla-Lametta

    Just one more little question, is it possible to disable this function for smaller devices?
    At the moment it also shrinks the logo in mobile view, which doesn´t look so good.

    April 22, 2020 at 11:43 am #1206147
    Yigit

    Hi,

    Please try changing the code in functions.php file to following one

    function add_decrease_logo(){
if(!wp_is_mobile()){
?>
<script>
jQuery(window).scroll(function(){
if(jQuery(this).scrollTop() > 200) {
		jQuery('.logo img').addClass('decreased');
	} else {
		jQuery('.logo img').removeClass('decreased');
	}
});
</script>
<?php
}
}
add_action('wp_footer', 'add_decrease_logo');

    Best regards,
    Yigit

    April 22, 2020 at 12:39 pm #1206161
    Skylla-Lametta

    Fantastic, now it looks great!
    Thank you!

    April 22, 2020 at 12:43 pm #1206164
    Yigit

    Hi,

    You are welcome! :)

    For your information, you can take a look at Enfold documentation here – https://kriesi.at/documentation/enfold/

    If you have any other questions or issues, feel free to start a new thread under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Logo doesn´t rescale while scrolling’ is closed to new replies.