1

我想创建一个按钮列表，例如一个数字 X 迷你球，基于一个容器中的 X 个 div。我要这个：

∞ ∞ ∞ ∞</p>

基于多个div。

并且每个按钮都有每个 div 的位置（带有动画滚动条），如果我单击其中一个项目，我将转到链接到 div 的这个位置。

例如：

<div id="scroller">
<div id="content">number1</div>
<div id="content">number2</div>
<div id="content">number3</div>
</div>

我有：

<ul>
<li><div id="ball"></div></li>
<li><div id="ball"></div></li>
<li><div id="ball"></div></li>
</ul>

因此，如果我点击第三个“迷你球”，我将转到 div“number3”的位置。

我希望你能理解！

4

1 回答 1

0

你不能给不同的元素相同的ID！

基本上，您需要在单击特定按钮时显示特定的部门。有很多方法可以解决这个问题。

所有这些方法都需要你做一件事，检测特定的按钮点击并推断出要显示的 div

下面我向您展示世界上最简单的示例（为了它）..它应该给您一个想法：

相应的html：

<body >
     <ul>
        <li><div id="ball1" data-target="content1">button 1</div></li>
        <li><div id="ball2" data-target="content2">button 2</div></li>
        <li><div id="ball3" data-target="content3">button 3</div></li>
    </ul>   

   <div id="scroller">
        <div id="content1" class="number">number1</div>
        <div id="content2" class="number">number2</div>
        <div id="content3" class="number">number3</div>
    </div>


</body>

相应的jquery代码：

<script type='text/javascript'>

    $(document).ready(function(){

       $('ul').find('li').find('div').click(function(){

             var target = $(this).attr('data-target');
             $('#'+target).slideToggle(1000);

       });

    });
</script>

各自风格：

<style>
    .number
    {
       display:none;
    }
</style>
于 2013-03-03T15:13:45.167 回答