如何滑動垂直菜單jQuery？

我一直試圖創建一個CSS和jQuery的垂直幻燈片菜單，但沒有運氣。我如何獲得jQuery中的每個點擊項目菜單？如何滑動垂直菜單jQuery？

from my ul class =「flyoutFirst」。

每個class =「flyoutFirst」都有自己的項目鏈接，如標記。

謝謝你教我。

這裏是例如jQuery代碼：

$(function() { 
    $('.list li').click(function() { 
    $('.list').animate({ 
     left: '-100%' 
    }); 
    return false; 
    }) 

    $('.back').click(function() { 
    $('.list').animate({ 
     left: '0' 
    }); 
    }) 

});

更多細節： link to jsfiddle

最好的問候，

猿

來源

2016-07-16 Giant Ape

試過的鏈接，我認爲它做工精細，請清楚地強調你的問題。你想要什麼

來源

2016-07-16 12:03:39

喜@reside感謝您的回答。基本上我想顯示我的UL類=「flyoutFirst」。現在，當我點擊文章時，它只顯示最後一個ul class =「flyoutFirst」。 –

其實，我不明白，你想做什麼。但是，有關與嵌套元素點擊事件的所有信息，你可以在這條路上：

$('.list li').click(function(e) { 
console.log(e);

爲「E」的說法，你可以得到所有的信息。 https://jsfiddle.net/cfrd6mg9/

來源

2016-07-16 12:06:09

嗨@Alexey抱歉，不清楚的問題。當我點擊文章時，我想顯示我的每個課程=「flyoutFirst」。 –

對不起，但我不明白，你的班級應該包含在哪裏 –

好Finaly我找到了一個解決方案。

也許這不是一個好的解決方案，但它是工作！在我的js文件：

$(function() { 
     $('.list li').click(function() { 
     $('.list').animate({ 
      left: '-100%' 
     }); 
     $(this).find('.flyoutFirst').css({display: 'block'}); 
     return false; 
     }) 

     $('.back').click(function() { 
     $('.list').animate({ 
      left: '0' 
     }, function(){ 
      $(this).find('.flyoutFirst').css({display: 'none'}); 
     }); 
     }) 

    });

看到我更新的jsfiddle

，只是添加顯示：沒有在我的課flyoutFirst在CSS。希望也能幫助人們非常基本的想法如何創建一個幻燈片菜單。謝謝大家。

最好的問候，

猿

來源

2016-07-16 14:57:40

如何滑動垂直菜單jQuery？

回答

相關問題