用animate做點擊翻頁動畫時發現第二次點擊事件動畫沒反應，而第一次點擊有動畫效果，代碼如下：
復制代碼代碼如下:
$(".page").stop().animate({top:“-300px”}, 800, 'easeInOutExpo');
第二次點擊事件動畫沒反應的原因：top是page元素頂部相與其父元素頂部的距離，第一次點擊后，page元素頂部已經移動到距其父元素頂部-300px的位置，第二次點擊時的并不是page在移動后的位置繼續t移動-300px，而是當前的位置據其父元素頂部-300px。顯然第一次已經移動到top：-300px的位置，第二次的top：-300px移動距離為0，所以沒反應。
解決方法：
復制代碼代碼如下:
$(".page").stop().animate({top:“-=300px”}, 800, 'easeInOutExpo');
top:“-=300px”，這樣第二次點擊時會在第一次點擊后的位置上繼續移動-300px。
如果動畫移動的距離是變量，就不能用“-=變量名”來寫了：
- function down() {
- var page_h=$(".page").height(); //687
- var page_top=parseInt($(".page").css("top")); //0
- var move=wrap_top+page_h;
- $(".page").stop().animate({top:move}, 800, 'easeInOutExpo');
- };
學習交流
- HTC M8怎么換主題 M8換主題方法12-23
- 錘子手機如何開啟單手撥號面板12-23
- OPPO R7拍照音如何關閉12-23
- LG G3如何開啟來電翻轉靜音12-23
- 兩種方式登錄FTP10-30
- 查看一個頂級域名下所有的二級域名10-30
- 用HOSTS文件屏蔽網站 建立網站映射的方法10-30
- 域名狀態及其意義總結10-30
- 二級域名原理以及程序，申請即可開通10-28
熱門圖片
猜你喜歡的新聞
新聞熱點
2024-04-27 13:35:46
2024-04-27 13:33:47
2024-04-24 22:53:44
2024-04-23 19:32:50
2024-04-23 19:25:50
2024-04-23 19:13:19
疑難解答
圖片精選