javascript - 滚动时收缩标题

标签 javascript jquery html css shrink

我看到的大多数关于在滚动时缩小标题的帖子都涉及使用 jQuery 动画或类似的东西。这让它变得太明显和即时,但我正在寻找渐进的东西:

http://www.kriesi.at/themes/enfold/

这是一个很好的例子,我正在尝试做类似的事情:

jQuery(document).ready(function($){
    var $myDiv = $('#logo img');
    var logoHeight = $myDiv.height;
    var stop = false;

    $(window).scroll(function() {
        logoHeight = $myDiv.height;
        var st = $(this).scrollTop();

        if(st >= 50 || logoHeight >= 97){
            stop = true;
        }

        if(!stop){
            $myDiv.height(st);
        }
    }).scroll();
});

使用此 jQuery 跟踪滚动。问题是它永远不会停止或根本不出现。有没有更好的方法来实现我的意思?

最佳答案

您使用 stop 的方式,在您将其设置为 true 后,它再也不会变为 false。

也许是这样的:

var stop = (st >= 50 || logoHeight >= 97);

代替 if 并删除上面的行 var stop = false;

关于javascript - 滚动时收缩标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19411194/

相关文章:

jquery - 如何更改移动设备的 HTML 类?

javascript - 动态文本框验证问题

javascript - 将事件附加到 DOM 上的所有内容的最明智的方法是什么?

javascript - 检查我的网站是否在另一个选项卡中打开

Javascript 正则表达式在 mozilla 和 IE 中的破坏

javascript - 如何在数据库中插入数据后重新加载页面

javascript - CSS 中内嵌的 SVG 图像

javascript - 如何在不刷新页面的情况下重复each()

html - 如何让一个图像出现在另一个图像的悬停上?

html - 当页面宽度较低时,将两列(div)彼此对齐