Question

在当前状态下，在我的网站上，我可以使用我创建的导航按钮，鼠标滚动或键盘或拖动滚动条滚动浏览不同的部分。

我想要的是用户应该只能使用我创建的导航单选按钮浏览这些部分，而不是其他任何内容。

我的代码：

HTML：

        <ul class="scrollLinks">
            <li class="active"><a href="#heroOneData"></a></li>
            <li><a href="#heroTwoData"></a></li>
            <li><a href="#heroThreeData"></a></li>
            <li><a href="#heroTwoData" class="scrollArrow"><img src="<?php echo get_template_directory_uri(); ?>/img/scrlDnArrow.png" /></a></li>
        </ul>

TARGET HTML：

<div data-related="heroOneData">
   ...content...
</div>
<div data-related="heroTwoData">
   ...content...
</div>
<div data-related="heroThreeData">
   ...content...
</div>

jQuery的：

$('.scrollLinks li a').click(function(){
    var hashRaw = $(this).attr('href'); 
    var hash = hashRaw.substring(1);
  jQuery('html, body').animate({
        scrollTop: jQuery( "[data-related='"+hash+"']" ).offset().top
  }, 1000);
});

Answer 1

解决方案：

html, body { height:100%; overflow:hidden; }

信用：

Darth Batu Khan

避免滚动鼠标或滚动条

1 个答案: