タブを左右にスライドさせる

Question

• jsとjqueryを初めて使用しています。
• 私は左と右の矢印が含まれていることにタブコードがあります。
• 右矢印を選択すると、滑らかなスライドで次のタブに移動します。
• 左矢印を選択すると、滑らかなスライドで次のタブに移動します。
• でもタブの内容が変更されるはずです。
• あなたは私にそれを修正する方法を教えてもらえますか？
• 下記のコードを提供してください。

https://codepen.io/texirv/pen/MvXZQX?editors=1111

.right { 
    transform: rotate(-45deg); 
    -webkit-transform: rotate(-45deg); 
} 

.left { 
    transform: rotate(135deg); 
    -webkit-transform: rotate(135deg); 
} 



    $('.left').click(function(){ 

    console.log("I am testing"); 

    }) 

Answer 1

あなたは、現在アクティブなタブを見つけて、クリックされたボタンに基づいて、次/前のタブをクリックする必要があります。ここで

は、使用できるコードの例です。

$('.left').click(function(){ 
    move('left'); 
    }) 
    $('.right').click(function(){ 
    move('right'); 
    }) 
    function move(to) { 
    var current = $('li.current').index(); 
    var total = $('.tabs .tab-link').length; 
    var add; 
    switch (to) { 
     case 'left': 
     add = -1; 
     break; 
     case 'right': 
     add = 1; 
     break; 
    } 
    $('.tabs li.tab-link').eq((current+add)%total).click(); 
    } 

これはあなたのcodepenに基づいて更新される：
https://codepen.io/anon/pen/XaYGRM