繁体   English   中英

如何将这支笔的代码集成到我的网站上?

[英]How can I integrate the code from this pen onto my site?

我从wordpress网站上使用相同的代码创建了这支笔,但是它在我的实际网站上不起作用。 我已经清除了网站缓存并将其关闭,我也尝试过使用wp_enqueue_script,但是失败了(可能是用户错误)。 如何在我的网站上使用它? 除js外,这支笔中的所有内容均可在该网站上运行。 救命! :(

HTML:

<a href="#introjump"><img class="down-arrow" src="http://www.themainconcept.com/wp-content/uploads/2015/11/down-arrow-wht.png" alt="down arrow wht"/></a>

CSS:

.down-arrow {
    position: fixed;
    bottom: 1%;
    left: 50%;
    max-width: 3.5%;
    min-width: 3.5%;
    width: 3.5%;
    box-shadow: none;
    opacity: 0.6;
}
.down-arrow:hover {
    opacity: 1;
}

.filler {
    height: 10000px;
}

使用Javascript:

$(window).scroll(function() {
   $(".down-arrow").css("opacity", 1 -
      $(window).scrollTop() / 250);
    });

[link]( https://codepen.io/ericshio/pen/zBRbAY

您要包装功能吗? 尝试像这样包装它:

$(document).ready(function() {

$(window).scroll(function() {
   $(".down-arrow").css("opacity", 1 -
      $(window).scrollTop() / 250);
    });

});

这是在Toby的帮助下对我真正起作用的。 他的回答没有用,但是却把我引向正确的方向。

(function($) {
    $(window).scroll(function() {
        $(".down-arrow").css("opacity", 1 - $(window).scrollTop() / 250);
    });
})(jQuery);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM