IE之動(dòng)態(tài)添加DOM節(jié)點(diǎn)觸發(fā)window.resize事件
更新時(shí)間：2010年07月27日 09:13:33 作者：
因?yàn)轫撁婧芏郩I是絕對(duì)定位的,所以當(dāng)窗口大小改變的時(shí)候會(huì)使原先的布局混亂,只好在每次window.resize的時(shí)候重新布局...
然后頁面有幾個(gè)事件是動(dòng)態(tài)地增加DOM元素的,比如點(diǎn)擊某個(gè)層會(huì)在底下列出該層詳細(xì)內(nèi)容,這樣在FF和chrome下沒出現(xiàn)問題,但是在IE6-8下每次都重布局了.
比如我拖動(dòng)一個(gè)層,在拖動(dòng)過程中層的內(nèi)容又顯示在最底下了,當(dāng)我放開層的時(shí)候這個(gè)層就跳回拖動(dòng)前的位置了...
起先我還沒看出來是重布局了...然后演示了N久,掙扎了N久,終于覺得可能是由于動(dòng)態(tài)增加DOM節(jié)點(diǎn)導(dǎo)致觸發(fā)window.resize而使頁面重布局了...
最后我不由地在心里喊了句"Thank godness....",還好改變窗口的高度對(duì)頁面布局沒有影響,不然真要麻煩死了...
bindResizeWindow:function(){
var obj = this;
$(window).resize(function(){
var newWidth = $(window).width();
if(newWidth == obj.windowWidth){return;}
obj.initUI();
obj.createUI();
obj.windowWidth = newWidth;
});
},
只要在綁定方法中判只有寬度改變時(shí)才觸發(fā)重布局事件就行了...
比如我拖動(dòng)一個(gè)層,在拖動(dòng)過程中層的內(nèi)容又顯示在最底下了,當(dāng)我放開層的時(shí)候這個(gè)層就跳回拖動(dòng)前的位置了...
起先我還沒看出來是重布局了...然后演示了N久,掙扎了N久,終于覺得可能是由于動(dòng)態(tài)增加DOM節(jié)點(diǎn)導(dǎo)致觸發(fā)window.resize而使頁面重布局了...
最后我不由地在心里喊了句"Thank godness....",還好改變窗口的高度對(duì)頁面布局沒有影響,不然真要麻煩死了...
復(fù)制代碼 代碼如下:
bindResizeWindow:function(){
var obj = this;
$(window).resize(function(){
var newWidth = $(window).width();
if(newWidth == obj.windowWidth){return;}
obj.initUI();
obj.createUI();
obj.windowWidth = newWidth;
});
},
只要在綁定方法中判只有寬度改變時(shí)才觸發(fā)重布局事件就行了...
您可能感興趣的文章:
- 一些主流JS框架中DOMReady事件的實(shí)現(xiàn)小結(jié)
- JQuery為頁面Dom元素綁定事件及解除綁定方法
- JavaScript DOM 添加事件
- javascript 刪除dom對(duì)象的事件函數(shù)代碼
- Javascript Event事件中IE與標(biāo)準(zhǔn)DOM的比較
- jQuery 選擇器、DOM操作、事件、動(dòng)畫
- Google Map V3 綁定氣泡窗口(infowindow)Dom事件實(shí)現(xiàn)代碼
- jquery中dom操作和事件的實(shí)例學(xué)習(xí) 下拉框應(yīng)用
- jquerydom對(duì)象的事件隱藏顯示和對(duì)象數(shù)組示例
- DOM中事件處理概覽與原理的全面解析
相關(guān)文章
JavaScript接口防止重復(fù)請求的方法總結(jié)
在前端開發(fā)中,防止重復(fù)請求是一個(gè)常見的問題,重復(fù)請求不僅會(huì)增加服務(wù)器的負(fù)載,還可能導(dǎo)致數(shù)據(jù)不一致等問題,本文為大家整理了一些常用的解決方法,需要的可以參考下2024-12-12
這篇文章主要為大家介紹了TypeScript類型使用示例剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05
javascript實(shí)現(xiàn)文字無縫滾動(dòng)
這篇文章主要介紹了javascript實(shí)現(xiàn)文字無縫滾動(dòng)，文字可以實(shí)現(xiàn)上下滾動(dòng)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
懸浮窗就是圖中微信圖標(biāo)的按鈕，采用fixed定位，可拖動(dòng)和點(diǎn)擊。本文給大家分享一個(gè)比較常見的常見，通過實(shí)例代碼給大家介紹微信小程序中懸浮窗功能的實(shí)現(xiàn)，一起看看吧2019-08-08
uniapp引用echarts的詳細(xì)步驟(附柱狀圖實(shí)例)
最近在uni-app搭建的微信小程序項(xiàng)目中使用了ECharts,下面這篇文章主要給大家介紹了關(guān)于uniapp引用echarts的詳細(xì)步驟,文中還附有柱狀圖實(shí)例,需要的朋友可以參考下2022-07-07
javascript構(gòu)造函數(shù)以及原型對(duì)象的理解
本文主要介紹了javascript構(gòu)造函數(shù)以及原型對(duì)象的理解。分享了有關(guān)它們的實(shí)例代碼，具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
這篇文章主要介紹了Bootstrap Table中的多選框刪除功能，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-07-07
PNGHandler-借助JS讓PNG圖在IE下實(shí)現(xiàn)透明（包括背景圖）
PNGHandler-借助JS讓PNG圖在IE下實(shí)現(xiàn)透明（包括背景圖）...2007-08-08
解決layui數(shù)據(jù)表格排序圖標(biāo)被超出的表頭擠出去的問題
今天小編就為大家分享一篇解決layui數(shù)據(jù)表格排序圖標(biāo)被超出的表頭擠出去的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09
在javascript中涉及字符串大小寫轉(zhuǎn)換的方法有4個(gè)：toLowerCase()、toLocaleLowerCase()、toUpperCase()及toLocaleUpperCase()。今天我們主要來用下toUpperCase()和toLowerCase()方法。2015-05-05