jquery 停止animate动画,并且回复最初状态

    // 热门推荐悬浮效果
    $("#recom_con li img").mouseenter(function(){
        $(this).stop(true, true);
        $w = parseInt($(this).width())+10;
        $(this).animate({‘width‘:$w},300);
    });
    $("#recom_con li img").mouseleave(function(){
        $(this).stop(true, true);
        $w = parseInt($(this).width())-10;
        $(this).animate({‘width‘:$w},300);
    });

http://www.w3school.com.cn/jquery/effect_stop.asp

时间: 2024-10-10 05:56:06

jquery 停止animate动画,并且回复最初状态的相关文章

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

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

jquery的animate({})动画整理

在网页制作的过程中少不了用到各种动画,形式多种多样,flash,css,js,canvas,等等都能实现,对于其优劣和效果只能说各有千秋. 什么是动画效果,其实网页中的渐变效果就是一种很基础的动画,动画的基础是时间效果,在规定的时间内完成什么效果.动画最关键的一点还是根据人类的视觉习惯而来,动的东西往往是心灵捕捉的对象.抓住用户的眼光,以动画为基础宣传自己迫切想表达的并且美化丰富界面内容,也算是动画的内涵了. 下面提到的是使用jQuery如何实现动画效果,动画的要素是动,move当然有需要对cs

用jquery的animate动画函数做的网页效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>鼠标放上去透明度和位移都变化</title> <style> * { margin:0; padding:0; } .dv1 { position: relative; left:0; top:200px; width:100px; height

jquery中animate()动画方法

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="jquery-2.1.1.min.js" ></script> <style> #div1{width:100px;height:100px;background:red;} #div2{width:

jquery 温故而知新 animate动画的一些坑

注意1,只有hover事件后才能紧跟着第二个回调函数(mouseleave),尽量还是不使用mouseover事件了 注意2,.stop(false,true); 结束动画,在动画队列中删除自己,并且直接按照原计划的动画效果的完成结果体现结束. $(".header-list li").hover(function(e){ slideDowning = true; var selector = $(this).children('ul'); if(!selector.is("

jQuery如何停止元素的animate动画,还有怎样判断是否处于动画状态?【转】

停止元素的动画方法:stop() 语法结构:stop([clearQueue],[gotoEnd]) clearQueue 和 gotoEnd 都为可选参数,为布尔值. clearQueue : 是否要清空未执行玩的动画列表 gotoEnd : 是否直接将正在执行的动画跳转到末状态 经常在hover时间的动画效果里用到 stop() 方法,可以避免动画效果与光标动作不一致时导致的延迟动画. 例如: $(".test").hover(function(){     $(this).sto

jQuery停止动画和判断是否处于动画状态

1.停止元素的动画 stop([clearQueue][,gotoEnd]); 参数clearQHCHC和gotoEnd都足町选的参数,为Boolean值(ture或flase).clearQueue代表足胥婴清空术执{j.完的动嘶队列,90toEnd代表是否直接将萨在执行的动画跳转到术状态. 如粜商接使川stop()方法.![!IJ会.一即停.l卜专前一在进行的动画,如.粜接下来还有动画等待继续进行.呲0以当前状态J r始接下柬的动画.经常会遇到这种情况.在为.’个元索绑定hover事件之后.

jQuery基础(动画篇 animate,显示隐藏,淡入淡出,下拉切换)

1.jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的style属性,这里jQuery提供了一个快捷的方法.hide()来达到这个效果   $elem.hide() 提供参数: .hide( options ) 当提供hide方法一个参数时,.hide()就会成为一个动画方法..hide()方法将会匹配元素的宽度,高度,以及不透明度,同时进行动画操作

jquery 停止动画 stop的几种用法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-