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