JQuery 中 animate() 方法使用

JQuery animate()方法使用说明

语法:$(selector).animate({params},speed,callback)

其中,params是多个参数列表,例如:

{

left:‘++50px‘,

opacity:‘0.5‘,

height:‘200px‘,

width:‘300px‘

};

speed规定动画的展示时间,可以为‘slow’和‘fast’,也可以设置为毫秒数;

callback是动画演示完后执行的回调函数,可自行设定。

演示例子:

$(document).ready(function(){

  $("button").click(function(){

    $("div").animate({

      left:‘+=50px‘,

      opacity:‘0.5‘,

      height:‘150px‘,

      width:‘150px‘

    },1000,function(){alert("hahahha")});

  });

});

 

时间: 2024-11-18 20:26:28

JQuery 中 animate() 方法使用的相关文章

jQuery中animate()方法以及$('body').animate({"scrollTop":top})不被Firefox支持问题的解决

$("body").animate({"scrollTop":top}): 只被chrome支持,而不被Firefox支持 $("html").animate({"scrollTop":top}): 只被Firefox支持,而不被chrome支持. 如果想让这段js被chrome和Firefox都支持的话,应该这样: $("html,body").animate({"scrollTop"

论jQuery中animate方法的回调问题

今日在使用jQuery中animate方法的回调函数时,发现当回调函数内嵌animate方法时,并且将这些放在循环中时会出现:先是外部animate被执行,然后再是内部animate被执行.经过多次试验以及网上查询,发现js引擎单线程的,异步事件只能排队等候执行,而不能同时执行.而animate方法是采用计时器和延时器进行闭包而成的方法,相应的计时器和延时器是异步的,故animate方法也是异步执行的.这样就可以解释了:

jQuery中animate()的方法以及$("body").animate({"scrollTop":top})不被Firefox支持问题的解决

jQuery中animate()的方法可以去w3school查看,这里主要说一下: $("body").animate({"scrollTop":top}) 不被Firefox支持问题的解决. 其实是使用body的: $("body").animate({"scrollTop":top}) 只被chrome支持,而不被Firefox支持. 而使用html的: $("html").animate({"

jQuery 效果 - animate() 方法

http://www.w3school.com.cn/jquery/effect_animate.asp 实例 改变 "div" 元素的高度: $(".btn1").click(function(){ $("#box").animate({height:"300px"}); }); 亲自试一试 定义和用法 animate() 方法执行 CSS 属性集的自定义动画. 该方法通过CSS样式将元素从一个状态改变为另一个状态.CSS属

jQuery中animate动画第二次点击事件没反应

jQuery中animate动画第二次点击事件没反应 用animate做点击翻页动画时发现第二次点击事件动画没反应,而第一次点击有动画效果,代码如下: 复制代码 代码如下: $(".page").stop().animate({top:“-300px”}, 800, 'easeInOutExpo'); 第二次点击事件动画没反应的原因:top是page元素顶部相与其父元素顶部的距离,第一次点击后,page元素顶部已经移动到距其父元素顶部 -300px的位置,第二次点击时的并不是page在

JQuery中$.ajax()方法参数详解

url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请将此选项

“jquery中each方法和选择器”的学习笔记

<head> <title></title> <script src="jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { //alert($("div").text()); //对数组元素使用匿名函数进行逐个处理.

jQuery动画animate方法使用介绍

jQuery动画animate方法使用介绍 用于创建自定义动画的函数. 返回值:jQuery animate(params, [duration], [easing], [callback]) 如果使用的是“hide”.“show”或“toggle”这样的字符串值,则会为该属性调用默认的动画形式.paramsOptions一组包 含作为动画属性和终值的样式属性和及其值的集合 params 对象{},注意:所有指定的属性必须用骆驼形式,比如用marginLeft代替margin-left,如果使用

jQuery中attr()方法用法实例

本文实例讲述了jQuery中attr()方法用法.分享给大家供大家参考.具体分析如下: 此方法设置或返回匹配元素的属性值. attr()方法根据参数的不同,功能也不同. 语法结构一: 获取第一个匹配元素指定属性的属性值. 代码如下: $(selector).attr(name) 参数列表: 参数 描述 name 定义要获取其值的属性名称. 实例代码: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="