Make the Header Silder Image Static

Hi there,

Thanks for this amazing theme and wonderful support, I made the text slider static, as well as there, will only one image will be shown on my site, I want that slider image to be static and take away the parallax feature. I used the following code to achieve that but it didn’t have any effect at all.

    function($){
 if( $('#slideshow').length ) {

var image = 'http://staging.aybiz.com/wp-content/uploads/2017/12/Aybiz-cover-pic.png';

$('.page-wrap').prepend('<div class="site-top-image"><img src="'+image+'" alt="Image title" /></div>');

$(window).on('load resize', function() {

  var slideHeight = $('#slideshow').height();
  var divH        = $('.site-top-image').height();
  var newHeight   = slideHeight-divH;

  $('#slideshow').height(newHeight);

});
}
})(jQuery);

//CSS 

.site-top-image {
    text-align: center;
   margin-bottom: 20px;
 }
.site-top-image img {
  max-height: 100px;  
}  

Check the staging environment of my site.
Kindly share the solution.

Thanks!
Vince

Hi,

You can make the header image static with this Custom CSS:

.slides-container .slide-item {
    background-attachment: scroll !important;
    background-position: center !important;
}

Please add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also add the CSS to wp-admin -> Appearance -> Customizer -> Additional CSS so you won’t loose the changes after Theme or WordPress updates.

Please let me know how it works.

Kind Regards,
Csaba

Hi Csaba,

Thanks for the quick response, I applied the CSS shared and it worked well without any flaws.

Thanks!
Vince

Hi,

Great! You’re most welcome! If you need help with anything else, please open a new topic.

Have a nice day!

Kind Regards,
Csaba