轉換懸停手風琴onclick

我有一個手風琴菜單是用純css3開發的。目前它在懸停時打開菜單，但我希望它在點擊時打開。我能做到嗎？轉換懸停手風琴onclick

還有一個幫助。目前內容div位於標題的右側，但我需要在左側打開它。

內容div應該根據內容具有自動寬度。

這裏是DEMO

2012-08-23 Sowmya

嘗試使用：active而不是：hover – anderssonola

使用active將離開鼠標按鈕時關閉內容div。我希望點擊被切換 – Sowmya

$('h3','.horizontalaccordion ul li').on('click',function() { 
    $(this).closest('li').toggleClass('hover').siblings().removeClass('hover'); 
});

FIDDLE

來源

2012-08-23 07:30:31 adeneo

但是當我將光標移出div時，內容就是潛逃。你可以檢查一下嗎？ – Sowmya

'.horizontalaccordion> ul> li.hover> div {display：block; }'而不是'.horizontalaccordion：hover> ul> li.hover> div {display：block; } - http://jsfiddle.net/thebabydino/a545y/14/ – Ana

@Ana真棒！它的工作。最後一個幫助..我如何拿內容面板打開左側？ – Sowmya

我認爲你不只是需要一個點擊，但也想關閉先前打開的面板，那麼請看看這個代碼：

$('h3','.horizontalaccordion ul li').click(function() { 
    $('*[class*=hover]').removeClass('hover'); // close all opened tabs 
    $(this).closest('li').addClass('hover'); // open the currently clicked one 
});

jsFiddle Example

我希望這對你有用！

來源

2012-08-23 07:37:10

工作但同樣的問題。展開一個菜單，將光標移出手風琴，然後隱藏內容。請問chk – Sowmya

我剛剛在Chrome中檢查過，一切都很順利？你能告訴我你的瀏覽器是什麼？ –

轉換懸停手風琴onclick

回答

相關問題