滚动后启用粘滞按钮

时间:2020-05-11 17:13:39

标签: jquery css wordpress

我在Wordpress(divi)中有一个带有ID的粘滞按钮:buttonf

我想在滚动后启用它。所以我添加了一个jQuery代码,但是它不起作用,我尝试了很多,但是不明白为什么不这样做。

<div class="et_pb_column et_pb_column_4_4 et_pb_column_40  et_pb_css_mix_blend_mode_passthrough et-last-child"> 
    <div class="et_pb_button_module_wrapper et_pb_button_0_wrapper et_pb_button_alignment_right et_pb_module ">
            <a id="buttonf" class="et_pb_button et_pb_button_0 buttonf et_pb_bg_layout_light" href="/#cool">Get Yours</a>
        </div>
        </div>

jQuery代码:

    <script>
jQuery(document).ready(function() {

  var btn = $('#buttonf');

  $(window).scroll(function() {
    if ($(window).scrollTop() > 300) {
      btn.addClass('show');
    } else {
      btn.removeClass('show');
    }
  });

  btn.on('click', function(e) {
    e.preventDefault();
    $('html, body').animate({scrollTop:0}, '300');
  });

});

</script>

0 个答案:

没有答案