将悬停改为点击菜单 [英] Changing hover to click on menu

问题描述

我无法改变被点击'click'而不是'hover'的功能。我已经尝试将'悬停'更改为'点击'以及'切换'，但没有正面结果。

  $（'＃menu '）。hover（
 function（）{
 $（this）.stop（）。animate（{height：'100px'}，1000，function（）{}）; 
 $（this）.find（'div'）。show（600）; 
} 
，
 function（）{
 $（this）.stop（）。animate {height：'20px'}，1000，function（）{}）; 
} 
）; 
  

如果我想将它改为'click'，我必须绑定事件吗？任何帮助，非常感谢。

这是小提琴： http ：//jsfiddle.net/GANeX/7/

解决方案

试试这个：

http://jsfiddle.net/GANeX/52/ p>

  var clicked = 0; 
 $（'＃menu li'）。click（
 function（）{
 if（clicked === 0）{
 $（this）.stop（）。animate （{height：'100px'}，1000，function（）{}）; 
 $（this）.find（'div'）。show（600）; 
 clicked = 1; 
} else if（clicked === 1）{
 $（this）.stop（）。animate（{height：'20px'}，1000，function（）{}）; 
 clicked = 0; 
} 
} 
）; 
  

设置变量以跟踪点击状态

I am having trouble changing the function to be called on 'click' rather than 'hover'. I have tried changing 'hover' to 'click' as well as 'toggle' with no positive results

$('#menu li').hover(
    function(){
            $(this).stop().animate({height: '100px'},1000,function(){});
            $(this).find('div').show(600);
        }
    ,
    function(){
            $(this).stop().animate({height: '20px'},1000,function(){});
        } 
  ); 

Do I have to bind the event if I want to change it to 'click'? Any help is greatly appreciated.

Here's the fiddle: http://jsfiddle.net/GANeX/7/

解决方案

try this:

http://jsfiddle.net/GANeX/52/

var clicked = 0;
$('#menu li').click(
   function(){
        if(clicked === 0){
            $(this).stop().animate({height: '100px'},1000,function(){});
            $(this).find('div').show(600);
            clicked = 1;
        } else if(clicked === 1){
            $(this).stop().animate({height: '20px'},1000,function(){});  
            clicked = 0;
        }
    }
 );

set a variable to keep track of clicked state

这篇关于将悬停改为点击菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！