Question

我不是程序员，但我写的是HTML＆amp;每日CSS，通常可以将JavaScript和PHP拼凑在一起。请用设计师能理解的术语解释答案，谢谢！：）

我正在努力使我们的网站更有用，而且我遇到了修复标题和各种页面锚点的问题。我添加了一个脚本来创建平滑滚动并调整固定的标题高度。问题是我在WordPress安装上使用Visual Composer插件，并且我们的一个选项卡式页面元素无法正常使用新脚本：

https://newstart.staging.wpengine.com/treatment/mental-health/ocd/

查看底部附近的OCD子类型。单击子类型的选项卡锚点链接时，选项卡的div跳转到标题后面。在添加脚本之前，元素将保持静态并在标签之间正常翻转。

我们确实需要这个脚本，所以我想为这些标签链接添加一个类或ID过滤器。这样他们就完全被排除在剧本之外。我尝试过.not（）和：not（）选择器，但没有成功。这是脚本（taken from here）：

$('a[href^="#"]').on('click', function(e) {
var hash  = this.hash,
    $hash = $(hash),
    addHash = function() {
        window.location.hash = hash;
    };

if ( hash !== '#header' ) {
    $('html,body').animate({ 'scrollTop': $hash.offset().top -50 }, 500, addHash);
} else {
    $('html,body').animate({ 'scrollTop': $hash.offset().top }, 500, addHash);
}
e.preventDefault();
});

Answer 1

搞定了

$('a[href^="#"]').not($("#static a")).on('click', function(e) {
var hash  = this.hash,
    $hash = $(hash),
    addHash = function() {
        window.location.hash = hash;
    };

if ( hash !== '#header' ) {
    // $hash.velocity('scroll', { duration: 500, offset: -50, complete: addHash }); // Velocity.js
    $('html,body').animate({ 'scrollTop': $hash.offset().top -150 }, 700, addHash);
} else {
    // $hash.velocity('scroll', { duration: 500, offset: 0, complete: addHash }); // Velocity.js
    $('html,body').animate({ 'scrollTop': $hash.offset().top }, 700, addHash);
}
e.preventDefault();
});

将元素ID过滤器添加到页面锚点的jQuery脚本

1 个答案: