javascript - 使用 JQuery 向下滚动时无法调整标题大小

Question

一直在尝试使用此处的信息来减小滚动标题的大小：

jQuery - 向下滚动时缩小的粘性标题。

但是，虽然标题保持固定，但当我向下滚动时它并没有缩小。

这是我的 js 文件中的内容：

$(function(){
  $('#header').data('size','big');
});

$(window).scroll(function(){
  if($(document).scrollTop() > 0)
{
    if($('#header').data('size') == 'big')
    {
        $('#header').data('size','small');
        $('#header').stop().animate({
            height:'40px'
        },600);
    }
}
else
  {
    if($('#header').data('size') == 'small')
      {
        $('#header').data('size','big');
        $('#header').stop().animate({
            height:'120px'
        },600);
      }  
  }
});

有人可以帮我弄清楚为什么它不起作用吗？

我正在使用最新的 Wordpress 并将脚本排入主题的函数文件中 - 不知道此信息是否有帮助，但只想提供尽可能多的信息以解决我的问题。

Answer 1

快速浏览您的站点并尝试创建一个简单的函数来执行所需的更改...

$(window).scroll(function(){
    if($(window).scrollTop > 0){
        $('header').css({
            height:"40px"
        })
    }
    else{
        $('header').css({
            height:"120px"
        })
    }
})

我在 FF 上使用暂存器执行此操作，并收到一个错误，在我看来，这意味着 jquery 没有首先加载！

尝试将以下行添加到您的html head部分。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

Answer 2

控制台抛出错误：

Uncaught TypeError: Property '$' of object [object Object] is not a function 

我会尝试将您的代码包含在 -> jQuery(document).ready(function ($) { }

*重要的部分是 () 中的 $。

jQuery Uncaught TypeError: 对象 [object Window] 的属性“$”不是函数