javascript - Smooth Scroll doesn't work when I set the html and body height to 100% -
html, body { height: 100%; min-height: 100%; position: relative; } #home { height: 100%; background: url("../img/test.jpg") center no-repeat; background-size: cover; }
i'm using smooth scroll javascript css-tricks
$(function() { $('a[href*=#]:not([href=#])').click(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { var target = $(this.hash); target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); if (target.length) { $('html,body').animate({ scrolltop: target.offset().top }, 1000); return false; } } }); });
the first section of page it's full page image, need html , body have height of 100% set #home height 100% reason when smooth scroll effect doesn't work , when remove height: 100% html , body work.
anyone same problem?
use min-height: 100% instead of height: 100%.
Comments
Post a Comment