如何使手风琴在悬停时部分扩展，然后在单击时完全打开? [英] How to make accordion partially expand on hover and then fully open on click?

问题描述

是否可以使手风琴部分展开，然后在单击时完全打开?

Is it possible to make accordion partially expand and then fully open on click?

我一直在使用以下手风琴，但是我正在努力使它起作用. http://jqueryui.com/accordion/

I have been using the following accordion but I am struggling to get this to work. http://jqueryui.com/accordion/

我希望能够控制手风琴在悬停时打开的高度，然后使其在单击时完全打开.

I would like to be able to control the height the accordion opens on hover and then for it to open fully on click.

非常感谢您提供的任何帮助.

Thank you in advanced for any help provided.

推荐答案

首先创建手风琴，然后添加悬停功能.下面的代码可能会有所帮助:

Create the accordion first and then add the hover functionality. below code maybe helpful:

$('.ui-accordion-header').on('mouseenter',function(){

if(!($(this).next('.ui-accordion-content').css('display')=="block"))
{
    $(this).next('.ui-accordion-content').addClass('hover');
}
});

$('.ui-accordion-header').on('mouseleave',function(){
    $(this).next('.ui-accordion-content').removeClass('hover');
});

.hover类可能看起来像这样:

The .hover class may look something like this:

.hover{display:block !important; height:50px !important;} 

这篇关于如何使手风琴在悬停时部分扩展，然后在单击时完全打开?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！