jquery scrollTop延迟,滚动后位置固定

时间:2014-08-12 13:44:06

标签: jquery settimeout scrolltop

我想知道是否有人可以指示我达到与他们在本网站上使用的效果相同的方向,www.zakgroup.co.uk,我指的是页面顶部的新闻栏,向下滚动到一段时间后,将徽标的顶部更改为固定的徽标的位置;

我试图从网站上挑选代码但是没有成功。我是Jquery的新手。

我已设法获得滚动效果,但如何添加延迟并将位置更改为固定..

不幸的是,我的网站目前在本地,但无论如何这里都是代码。

$(function(){     
      $('html, body').animate({
        scrollTop: $('#logo').offset().top}, 1000 );
    }); 

我应该以某种方式制作if语句,当它滚动一定数量的像素时,将logo的属性设置为固定?

非常感谢

1 个答案:

答案 0 :(得分:0)

试试这个:

// grab the The initial position
var mavTop = $('#my-nav').offset().top;

$(document).scroll(function() {
  docScrollTop = $(document).scrollTop();
  if(docScrollTop > mavTop) {
    $('#my-nav').css({position: 'fixed', top: 0});
    if(docScrollTop > mavTop + 300) {
      $('#my-nav').css('background-color', '#00f');
    }
  } else if(docScrollTop < mavTop) {
    $('#my-nav').css({position: 'inherit', top: mavTop});
  }
});

演示:http://jsbin.com/siqasojinahu/1/edit