Question

我正在尝试在我的函数中执行2组变量（在我的functions.php中）

编辑 - 以下是将header-show / header-hide类应用于一个div（标题）的工作代码

jQuery(document).ready(function($){


// adjust this number to select when your button appears on scroll-down
var offset = 70,

// bind with the button link
$animation = $('header');

// apply animation
$(window).scroll(function(){
    ( $(this).scrollTop() > offset ) ? $animation.addClass('header-hide').removeClass("header-show"):
    $animation.addClass('header-show').removeClass("header-hide");
});

});

我想重用第二个div（＃top-btn）的代码，但无法使其工作。我的内容如下：

jQuery(document).ready(function($){

    function reusuableAnimationFunc(elementName, offset, hideClass, showClass) {
    $animation = $(elementName);

    $(window).scroll(function(){
      ( $(this).scrollTop() > offset ) ? $animation.addClass(hideClass).removeClass(showClass):
      $animation.addClass(showClass).removeClass(hideClass);
    });
  }

  reusuableAnimationFunc('header', 70, 'header-hide', 'header-show')
  reusuableAnimationFunc('#top-btn', 300, 'element-hide', 'element-show')

});

不确定它是否写得正确，或者我是否需要将其中的一部分放入我的html中。我只想为两个不同的div运行相同的功能

Answer 1

在jQuery.ready

之外无法访问该函数

您的功能应该在全球范围内。因此，您必须删除此“jQuery（document）.ready（function（$）{...}”。

替换为：

function reusuableAnimationFunc(elementName, offset, hideClass, showClass) {
        $animation = $(elementName);

        $(window).scroll(function() {
            ($(this).scrollTop() > offset) ? $animation.addClass(hideClass).removeClass(showClass):
                $animation.addClass(showClass).removeClass(hideClass);
        });
    }

    reusuableAnimationFunc('header', 70, 'header-hide', 'header-show')
    reusuableAnimationFunc('#top-btn', 300, 'element-hide', 'element-show')

将变量传递给函数

1 个答案: