1
我正在尝试使用照片库滑块导航制作一个简单的摄影网站，但是当我单击以查看下一张图片时，浏览器会重新定位到页面顶部。我在做什么错了，我该如何解决这个问题？先谢谢你！JavaScript图片库幻灯片
的html代码：
<div class="slider_nav">
<a href="#" class="left_arrow"><img src="./assets/images/arrow_left.png" width="50px"></i>
</a>
<ul class="bullets">
<li class="bullet current_bullet">•</li>
<li class="bullet">•</li>
<li class="bullet">•</li>
<li class="bullet">•</li>
</ul>
<a href="#" class="right_arrow"><img src="./assets/images/arrow_right.png" width="50px"></a>
</div>
</div>
javascript代码：
var everything = function() {
$(".right_arrow").click(function() {
var currentSlide = $(".current_slide");
var nextSlide = currentSlide.next();
var currentBullet = $(".current_bullet");
var nextBullet = currentBullet.next();
if (nextSlide.length === 0) {
nextSlide = $('.slide').first();
nextBullet = $(".bullet").first();
}
currentSlide.fadeOut(800).removeClass("current_slide");
nextSlide.fadeIn(800).addClass("current_slide");
currentBullet.removeClass("current_bullet");
nextBullet.addClass("current_bullet");
});
$(".left_arrow").click(function() {
var currentSlide = $(".current_slide");
var prevSlide = currentSlide.prev();
var currentBullet = $(".current_bullet");
var prevBullet = currentBullet.prev();
if (prevSlide.length === 0) {
prevSlide = $('.slide').last();
prevBullet = $(".bullet").last();
}
currentSlide.fadeOut(800).removeClass("current_slide");
prevSlide.fadeIn(800).addClass("current_slide");
currentBullet.removeClass("current_bullet");
prevBullet.addClass("current_bullet");
});
};
$(document).ready(everything);