0

您好，我的一些 JavaScript 代码有问题，我对 JavaScript 有点陌生，但正在学习:)。我找到了一个轮播并将其放在我的网站上，试图联系作者但没有希望。它有幻灯片的下一个/后退按钮，我想为导航链接添加交互性。前点击链接 3 转到幻灯片 3。但似乎无法使其工作。html是这样的：

<nav class="meniu">
    <a href="#">Slide 1</a>
    <a href="#">Slide 2</a>
    <a href="#">Slide 3</a>
</nav>
<div id="slider">
    <ul>
        <li>Slide 1</li>
        <li>Slide 2</li>
        <li>Slide 3</li>
    </ul>
</div>

javascript是这样的：

$(document).ready(function(){
$('.meniu a').each(function(index) {
    $(this).attr('id', index);
});});
// ^ should give all anchors in menu area an incremental id starting with 0^
$('.meniu a').click( function(){
//^when you click on anny anchor in menu area^
    var goTo = $(this).attr(id) * $('#slider').width()+ $('#slider').width();
    //^should make a variable with the id of the selected anchor menu 
    //and multiply it with the width of the slide IE: 0x800+800, 1x800+800^ 
    $('#slider ul').animate({ left: goTo }, 800, 'swing', function() {});
//^should move the slide to left with the number of goTo variable^
    window.location.hash = $(this).attr(id);
    //^should set the anchor portion of the url to the slected slide 
    // ex index.html#2^ 
});

我设法上传了我的网站 - beta.tropeum.ro 编辑：添加了 jsfiddle 链接 - http://jsfiddle.net/G7P46/

好的，找到了答案：

$('.meniu a').click(function(){
var goTo = this.id * - $('#slider').width() ;
$('#slider ul').animate({ left: goTo }, 800, 'swing', function(){});
$('.activenum').removeClass('activenum');
$(this).addClass('activenum');
decount = this.id;
window.location.hash = this.id;
});
4

0 回答 0