0

我有这个JS代码：

function overlay() {
    el = document.getElementById("overlay");
    el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}

单击时会打开一个新窗口。从第一次单击开始，我希望它接下来要做的是转到另一个功能。该功能需要一个包含 5 个 div 的滚动条。假设我希望它转到第三个 div 或 ID，我将如何编写这种类型的函数？所以一个 HTML 例子是：

<div id="this">
   <div class="outer">
       <div class="innerdiv">
           <div class="1" id="1">1</div>
           <div class="2" id="2">2</div>
           <div class="3" id="3">3</div>
           <div class="4" id="4">4</div>
           <div class="5" id="5">5</div>
        </div>
   </div>
</div>

这将代表我的滚动条。所以在最初的第一次点击时，想法是它会打开一个新窗口并滚动到第 3 个 div，或者如果滚动到它很困难，然后转到第一个 div。http://jsfiddle.net/qYTK4/

<div class="arrowbox">
      <div style="display:inline-block; width:155px; height: 50px; float:left;"></div>
      <div class="leftbox" id="leftbox"></div>
      <div class="backtohome"><a href='#' onclick='overlay()' style="text-decoration:none;">BACK TO HOME PAGE</a></div>
<div class="rightbox" id="rightbox"></div>

4

2 回答 2

0

使用window.scrollTo()并将其移动到对象位置。检索 HTML 元素的位置 (X,Y)

于 2013-10-01T18:27:55.467 回答
0

jQuery.ScrollTo是一个很棒的、简单的平滑滚动动画插件。它有大量用于定义滚动行为的方法，并且非常易于使用。链接的网站上有大量的演示和示例，您应该可以使用。在您的中，您只需告诉它滚动到 DOM 元素本身或第三个 div 的 jQuery 对象/选择器。

此外，您不能让id属性以数字开头（例如您的 div），这是无效的。类可以但不是 ID。

依赖click事件处理程序（即$('.backtohome a').on('click', function() { // your code });）而不是onclick属性也是一个好主意。

于 2013-10-01T18:29:56.190 回答