复合事件与显示效果

复合事件与显示效果

复合事件

​ hover(f1,f2):切换使用mouseover和mouseout()

​ toggle(f1,f2,f3,fn):版本问题(jquery1.9以前支持)

​ 多个click()事件，toggle()还有其他含义（隐藏与显示)

$(function(){
                $("#h1").mouseover(function(){
                    alert("悬浮");
                });
});

                $("#h1").hover(function(){alert("悬浮")},function(){alert("离开")});
                /*$("body").toggle(function(){
                    $(this).css("background-color","red");
                    
                },function(){
                    $(this).css("background-color","yellow");
                    
                },function(){
                    $(this).css("background-color","green");
                    
                });*/

显示效果

形式：hide([速度],[回调函数])；

​ 其中速度：可以是数字（毫秒），也可以是单词（fast normal slow，注意加双引号）

​ hide():隐藏

​ show:显示

​ toggle:切换隐藏与显示

​ 淡入淡出 （透明度）

​ fadeIn():淡入 显示

​ fadeout:淡出 隐藏

​

​ 控制高度

​ slideDown():下拉，显示

​ slideUp():上拉 隐藏

总结显示问题：

​ 显示：show() fadeIn() slideDown()

​ 隐藏：hide() dadeout() slideUp()

            function myShow(){
//              $("h3").show(3000,myCallBack);
                //$("h3").slideDown(3000);//下拉
                //$("h3").fadeIn(3000);//淡入
            }
            
            function myCallBack(){
//              alert("显示完毕");
            };
            
            function myHide(){
//              $("h3").hide(3000);
                //$("h3").slideUp(3000);//上拉
                //$("h3").fadeOut(3000);//淡出
            }

例：

    
        
        
    
    
        
我是h1
        
h3h3
        
color1
        

        
        显示
        隐藏