Re: [問題] jQuery滾輪動畫與modal衝突

[hanconquer (I love By2)]

我對於這類問題的作法都是用變數表示元件狀態，再依據元件狀態來開關功能。
(至少我以前寫硬體語言都是這麼搞的)

你可以宣告一個變數 var modelClose = true;

動畫原始碼改成這樣：
$(document).ready(function(){
        if(modelClose){
                動畫核心程式碼...
                ...
        }
});

model程式碼部分，
務必在第一行就讓modelClose = false，
關閉/取消model的程式碼中，最後一行讓modelClose = true。

這樣應該就搞定了，有錯請板上前輩指教！


※ 引述《cockroach727 (小強)》之銘言：
: 大家好 小弟正在自學做one page website
: 日前找到一段頗小巧的js
: 可以實作出 滑鼠滾輪觸發 捲動至上/下一個section的換頁動畫 效果順利
: 但我原本有個scroll bar的modal就因此廢了
: modal彈出時 滾輪會捲背景 modal裡的內容卻不會動
: 看起來像是mousewheel衝突到
: 有沒有辦法限制說 當modal彈出時disable掉這個滾輪換頁動畫(保持背景不動)
: 讓裡面的scroll bar正常運作
: 而關掉modal時再enable它
: 我用$('.modal').on('shown.bs.modal',function(e){})
: 寫了幾種判斷條件去wrap都沒用
: 請板上高手指點 感恩
: 附上這個動畫的原始碼:
: $(document).ready(function(){
:         var delay = false;
:         $(document).on('mousewheel DOMMouseScroll', function(event) {
:                 event.preventDefault();
:                 if(delay) return;
:                 delay = true;
:                 setTimeout(function(){delay = false},200)
:                 var wd = event.originalEvent.wheelDelta || -event.originalEvent.detail;
:                 var a= document.getElementsByTagName('section');
:                 if(wd < 0) {
:                 for(var i = 0 ; i < a.length ; i++) {
:                         var t = a[i].getClientRects()[0].top;
:                         if(t >= 40) break;
:                 }}
:                 else {
:                 for(var i = a.length-1 ; i >= 0 ; i--) {
:                         var t = a[i].getClientRects()[0].top;
:                         if(t < -20) break;
:                 }}
:                 $('html, body').stop().animate({
:                         scrollTop: $(a[i]).offset().top
:                 }, 800, 'easeInOutExpo');
:         });
: });

--
 Google  要有車 有帥|███████████████▕搜尋▏進階搜尋 | 使用偏好
                                                     ▇▇  ￣￣￣￣   ￣￣￣￣
         搜尋： ⊙所有網頁 ○中文網頁○繁體中文網頁 ○台灣的網頁

所有網頁      約有0項符合要有車 有帥的查詢結果，以下是第 0項。       共費23年。
您是不是要找 象棋

--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 59.127.195.161
※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1423074027.A.2A6.html
→ guanting886: 動畫的render可以設計一個佇列物件塞callback
→ guanting886: 來處理動畫的先後順序
→ guanting886: 2. 一個元件的狀態不該但一遍數來記錄，設計一個物件
→ guanting886: 統一管理會比較好，jQuery 可以利用 data() 來記錄
→ guanting886: element.data('close', true)
→ hanconquer: data() 不錯用耶，學到一招
推 cockroach727: 感謝 很多jQuery函數還沒摸熟