84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
大家好,我遇到的问题是一个类似于微信聊天的时候点击加号出现菜单,
打开菜单的时候没有什么问题,关闭菜单是先transition动画,然后设置display为none但是这样做好像display会破坏transition的执行,动画不会生效,请问怎么解决这个问题?
ringa_lee
你的display:none應該是立刻就執行了,並沒有在transition動畫後執行,所以直接就隱藏了。 如果你需要這樣做的話1、你可以延時執行dislpay:none的操作。 setTimeout(function(){//執行},200);2、如樓上操作用jQuery的animate,然後在animate的回調中設定dislpay:none;3、直接眼紅jQuery的slidedown
動畫可以寫在jQuery的animate()中,動畫完成後執行讓它display:none的回呼函數
jQuery
animate()
display:none
監聽transitionend事件,在回調裡面執行display:none操作
transitionend
你的display:none應該是立刻就執行了,並沒有在transition動畫後執行,所以直接就隱藏了。
如果你需要這樣做的話
1、你可以延時執行dislpay:none的操作。 setTimeout(function(){//執行},200);
2、如樓上操作用jQuery的animate,然後在animate的回調中設定dislpay:none;
3、直接眼紅jQuery的slidedown
動畫可以寫在
jQuery
的animate()
中,動畫完成後執行讓它display:none
的回呼函數監聽
transitionend
事件,在回調裡面執行display:none
操作