javascript - 如何使用 Javascript 和 PHP 启用鼠标滚轮水平滚动

Question

我正在使用 WPShower 的 Portra 主题:http://wpshower.com/demo/?preview_theme=portra我希望能够使用鼠标滚轮水平滚动，而不必捕获并拖动滚动条。

我发现了我认为可以帮助我从另一个讨论 Portra 姐妹主题的论坛实现这一目标的代码和插件链接:How to Prevent jquery.mousewheel.js from Loading on Pages in Wordpress但我不知道将代码粘贴到 WordPress 中的 php 文件(header.php 或其他)中的确切位置。

如果有人能指出我正确的方向，我将非常感激。

Answer 1

我会使用 jquery 来实现这一点。将两个脚本链接粘贴到头部:

<script type='text/javascript' src='/js/jquery.min.js'></script>
<script type='text/javascript' src='/js/jquery.mousewheel.min.js'></script>

然后在</body>之前把:

<script>
  $("#element").mousewheel(function(event, delta) { // #element - your element id which has horizontal overflow
      this.scrollLeft -= (delta * 30);
      event.preventDefault();
   });
</script>

自己尝试了一下，效果很好。 jquery 和鼠标滚轮的下载链接:http://www.mediafire.com/download/x6vwofzc0x5aeel/jquery_+_mousewheel.zip