-1

我有一个标题，但我被困在两件事上。

  1. 我怎样才能把它全部正确定位？我想要的是将它定位为底部带有导航栏的标题，然后在该导航栏中我想要一个可以滑动的 div 并且我想要 x 个标签。
  2. 如何使用 JavaScript/JQuery 使 div 向左/向右滑动？对不起，如果它没有意义。

我的代码是：

 <body>  
     <div class="header">
      <div id="topHeader"> </div>
        <div class="navBar">
        //buttons/text here
        <div id="slider"> </div>
        </div>
     </div>
 </body>

我尝试过使用定位（绝对/相对），但是当我将导航栏设为相对时，它不会停留在底部，但如果我将它和滑块都设为绝对，则滑块不会停留在导航栏中。还有其他方法可以实现吗？

4

1 回答 1

0

我无法理解如何使它工作。然而，事情就这样过去了。

标题的 css 将是：

.header {
display: block; // for that overall div..
}

然后你有一个顶部标题，它更像是你想要导航栏的顶部标题。好的，你说你希望它作为标题。然后就照原样写吧！它将用作标题，我的意思是只需添加一些边距和填充，以便它与其他对象有一定距离。

#topHeader {
margin: 5px; // overall 5px pixel for all sides.
padding: 2px; // 2 pixel padding..
}

导航栏是带有可能按钮和文本的导航栏，您将使用它们作为指向其他页面的超链接。正确的？所以尝试使用这样的东西：

<ul>
  <li>First text</li>
  <li>Second text</li>
  <li>Third text</li>
</ul>

现在，将它们全部显示在一行中。因为您希望它们排成一行，所以列表项将显示在一行中，而不是默认显示在彼此下方。选项卡x将是li列表中使用的数量，它将显示所有按钮或您试图显示的内容。为此，CSS 是：

li {
display: inline;
}

要删除项目符号样式，请使用以下命令：

ul {
list-style: none;
}

这样导航栏将像其他网站一样显示在一行中。

第二个问题：

滑块在鼠标的帮助下滑动，而不是 jQuery（开个玩笑）。你可以使用滚动条哥们，jQuery是用来滚动或滑动的，但是一旦滑动就隐藏了。您将能够看到它，但是当它向后滚动时，它将隐藏，并离开页面，直到您再次将其滑回。你可以坚持滚动条滚动或滑动。

就这样！

jQuery滑块：

如果您检查 jQuery API，slide()您会发现，任何元素上的任何事件都会导致某个元素中的滑动（将向上和向下滑动元素）。

这是一个例子：

$(document).ready(function () {
  $("#slider").click(function () {
    $(".navBar").slideToggle(1000); // the time consumed is 1 sec = 1000 milliseconds.
  }
});

您可以看到，单击元素id="slider"会滑动元素，class="navBar"并且滑动将消耗 1 秒的时间。

忠告或建议：

我想建议您首先了解有关您将使用的代码的基础知识。它们可以通过 Google、Bing 或任何其他搜索引擎轻松搜索。因为如果你发布你一无所知的问题会导致你投反对票。我知道这很荒谬。因此，当您要使用jquery并且对此一无所知时，请尝试去谷歌并写下这个搜索项jquery，如果没有找到，然后附加tutorial到搜索查询并找到它。最好的教程可以在开发者的网站上找到。就像您可以在 jquery.com 上学习 jQuery和在 json.org上学习JSON一样。

于 2013-09-10T02:36:25.650 回答