Web_Design 板


LINE

我對於這類問題的作法都是用變數表示元件狀態,再依據元件狀態來開關功能。 (至少我以前寫硬體語言都是這麼搞的) 你可以宣告一個變數 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://webptt.com/m.aspx?n=bbs/Web_Design/M.1423074027.A.2A6.html
1F:→ guanting886: 動畫的render可以設計一個佇列物件塞callback 02/05 02:59
2F:→ guanting886: 來處理動畫的先後順序 02/05 02:59
3F:→ guanting886: 2. 一個元件的狀態不該但一遍數來記錄,設計一個物件 02/05 02:59
4F:→ guanting886: 統一管理會比較好,jQuery 可以利用 data() 來記錄 02/05 03:00
5F:→ guanting886: element.data('close', true) 02/05 03:01
6F:→ hanconquer: data() 不錯用耶,學到一招 02/05 04:07
7F:推 cockroach727: 感謝 很多jQuery函數還沒摸熟 02/06 00:51







like.gif 您可能會有興趣的文章
icon.png[問題/行為] 貓晚上進房間會不會有憋尿問題
icon.pngRe: [閒聊] 選了錯誤的女孩成為魔法少女 XDDDDDDDDDD
icon.png[正妹] 瑞典 一張
icon.png[心得] EMS高領長版毛衣.墨小樓MC1002
icon.png[分享] 丹龍隔熱紙GE55+33+22
icon.png[問題] 清洗洗衣機
icon.png[尋物] 窗台下的空間
icon.png[閒聊] 双極の女神1 木魔爵
icon.png[售車] 新竹 1997 march 1297cc 白色 四門
icon.png[討論] 能從照片感受到攝影者心情嗎
icon.png[狂賀] 賀賀賀賀 賀!島村卯月!總選舉NO.1
icon.png[難過] 羨慕白皮膚的女生
icon.png閱讀文章
icon.png[黑特]
icon.png[問題] SBK S1安裝於安全帽位置
icon.png[分享] 舊woo100絕版開箱!!
icon.pngRe: [無言] 關於小包衛生紙
icon.png[開箱] E5-2683V3 RX480Strix 快睿C1 簡單測試
icon.png[心得] 蒼の海賊龍 地獄 執行者16PT
icon.png[售車] 1999年Virage iO 1.8EXi
icon.png[心得] 挑戰33 LV10 獅子座pt solo
icon.png[閒聊] 手把手教你不被桶之新手主購教學
icon.png[分享] Civic Type R 量產版官方照無預警流出
icon.png[售車] Golf 4 2.0 銀色 自排
icon.png[出售] Graco提籃汽座(有底座)2000元誠可議
icon.png[問題] 請問補牙材質掉了還能再補嗎?(台中半年內
icon.png[問題] 44th 單曲 生寫竟然都給重複的啊啊!
icon.png[心得] 華南紅卡/icash 核卡
icon.png[問題] 拔牙矯正這樣正常嗎
icon.png[贈送] 老莫高業 初業 102年版
icon.png[情報] 三大行動支付 本季掀戰火
icon.png[寶寶] 博客來Amos水蠟筆5/1特價五折
icon.pngRe: [心得] 新鮮人一些面試分享
icon.png[心得] 蒼の海賊龍 地獄 麒麟25PT
icon.pngRe: [閒聊] (君の名は。雷慎入) 君名二創漫畫翻譯
icon.pngRe: [閒聊] OGN中場影片:失蹤人口局 (英文字幕)
icon.png[問題] 台灣大哥大4G訊號差
icon.png[出售] [全國]全新千尋侘草LED燈, 水草

請輸入看板名稱,例如:iOS站內搜尋

TOP