效果

来源:互联网 发布:提花设计软件 编辑:程序博客网 时间:2024/05/16 01:54

1、隐藏和显示:

$(selector).hide(speed,callback);


$(selector).show(speed,callback);


$(selector).toggle(speed,callback);  //使用 toggle() 方法来切换 hide() 和 show() 方法。显示被隐藏的元素,并隐藏已显示的元素。


2、淡入淡出:

$(selector).fadeIn(speed,callback);


$(selector).fadeOut(speed,callback);


$(selector).fadeToggle(speed,callback);



3、滑动

$(selector).slideDown(speed,callback); //向下滑动


$(selector).slideUp(speed,callback); //向上滑动


$(selector).slideToggle(speed,callback);



4、动画

animate() 方法:

$(selector).animate({params},speed,callback); //必需的 params 参数定义形成动画的 CSS 属性。

实例:

把 <div> 元素往右边移动了 250 像素:

$("button").click(function(){  $("div").animate({left:'250px'});}); 


5、停止动画

stop() 方法:

stop() 方法用于停止动画或效果,在它们完成之前。

$(selector).stop(stopAll,goToEnd);



6、Callback 方法

Callback 函数在当前动画 100% 完成之后执行。

以下实例在隐藏效果完全实现后回调函数:

$("button").click(function(){  $("p").hide("slow",function(){    alert("The paragraph is now hidden");  });});



如果没有回调函数,警告框会在隐藏效果完成前弹出:

$("button").click(function(){  $("p").hide(1000);  alert("The paragraph is now hidden");});



7、Chaining方法链接

Chaining 允许我们在一条语句中运行多个 jQuery 方法(在相同的元素上)。

$("#p1").css("color","red").slideUp(2000).slideDown(2000);






0 0