将hover手风琴转换为onclick

我有一个用纯css3开发的手风琴菜单。 目前它是hover在它上面时打开菜单但我希望它在点击时打开。 我能做到这一点吗？

还有一个帮助。 目前内容div位于标题的右侧，但我需要在左侧打开它。

并且内容div应该具有基于内容的自动宽度。

这是DEMO

Answer 1

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

FIDDLE

Answer 2

我认为您不仅需要点击，而且还想关闭之前打开的面板，请查看此代码：

 $('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示例

我希望这对你有用！