jQuery中animate的height的自适应

可以用 animate() 方法几乎可以操作大部分CSS 属性,但其属性的值不能为字符串,很多人都遇到过这个问题。

例如:获取一个元素自适应时的高,但el.animate({height:‘auto’})是没有效果的。

今天我也遇到了这个,花了点时间解决了这个问题,然后就想做个随笔,顺便给大家分享一下。

(菜鸟一只,第一次发随笔,不喜的尽量喷,嘻嘻)

解:使用css获取当前元素自适应时的高,然后就可以直接使用了。

var h_header=header.css("height","auto").height();

header.animate({height:h_header},500);

时间: 2024-08-17 15:49:07

jQuery中animate的height的自适应的相关文章

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

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

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({left:'-='+width})中的 '-='+是什么意思?

left:'-='+width的意思是:left属性的最终值,是left现有值减去width这个值 例如:left:'200px' 意思是left最终值变成200left:'+200px' 意思与上面相同,是left最终值变成200left:'+=200px' 假设当前left为100 意思是left最终值是当前值加200 ,最终值为300 -=同理 -=应该是left=left-width的意思 https://zhidao.baidu.com/question/921906882845071

论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的使用 0.0

一.使用方法 1.$("div").animate( {width:"300px"}); $("div").animate( {'width':'300px'}); $("div").animate( {'width':300+"px"}); $("div").animate( {'width':300}); $("div").animate( {width:300}

Jquery中animate可以操作css样式属性总结

可以用 animate() 方法来操作所有 CSS 属性吗? 是的,几乎可以!不过,需要记住一件重要的事情:当使用 animate()时, 必须使用 Camel 标记法书写所有的属性名,比如,必须使用 paddingLeft 而不是 padding-left,使用 marginRight而不是 margin-right,等等. css中的不是所有属性都可以用Jquery动画(animate函数)来动态改变,下面总结了JQ可以操作元素的一些属性: * backgroundPosition * bo

JQuery 中 animate() 方法使用

JQuery animate()方法使用说明 语法:$(selector).animate({params},speed,callback) 其中,params是多个参数列表,例如: { left:'++50px', opacity:'0.5', height:'200px', width:'300px' }: speed规定动画的展示时间,可以为‘slow’和‘fast’,也可以设置为毫秒数: callback是动画演示完后执行的回调函数,可自行设定. 演示例子: $(document).re

jQuery中animate与scrollTop、offset().top实例

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con