Question

我正在开发一个视差投资组合网站，并希望包含一些jquery功能。目前我有一个工作下拉库，但我想在图库中添加点导航。添加点导航后，下拉功能停止工作。我在jsfiddle上建立了一个例子。第一个链接显示下拉功能。（目前同时打开每个图库。）第二个链接添加点导航。

http://jsfiddle.net/carincamen/pvphpcuw/12/

HTML：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<body>
<p>Click the small black box to show the large rectangle box.</p>

<img class="arrow"> 

<div class="gallery"></div>

CSS：

.gallery {
    position: relative;
    width: 620px;
    height: 215px;
    top: 30px;
    left: 50px;
    background-color: rgb(0,0,0);
}

.arrow{
    position: relative;
    width:20px;
    height: 20px;
    top: 15px;
    left: 340px;
    background-color: rgb(0,0,0);
}

jQuery的：

$(document).ready(function(){
  var display =$('.gallery');
  $(display).hide();
  $('.arrow').click(function(){
    $(display).toggle();
  });
});

http://jsfiddle.net/carincamen/pvphpcuw/

为了便于演示，我对点导航按钮进行了颜色编码以与幻灯片对应。

提前感谢您的协助。非常感谢。

Answer 1

特别感谢LinkedIn小组成员，他们很快就去看了。单击箭头时图库会下降，然后导航按钮会更改滑块。小导航按钮根据相应的滑块增加和减少不透明度，大圆圈移动到与滑块对应的点导航。可以找到工作代码here。希望这是有帮助的。

我需要删除$(this).next，然后使用$，然后添加$("[class^=gallery]").hide()以删除上一个图库。

下拉图库中的Jquery点导航

1 个答案: