-
求minH在數組hArr中的索引：$.inArray(minH,hArr); 求數組最小值var minH=Math.min.apply(null,hArr);查看全部
-
alert($(window).height()); //瀏覽器時下窗口可視區域高度 alert($(document).height()); //瀏覽器時下窗口文檔的高度 alert($(document.body).height());//瀏覽器時下窗口文檔body的高度 alert($(document.body).outerHeight(true));//瀏覽器時下窗口文檔body的總高度 包括border padding margin alert($(window).width()); //瀏覽器時下窗口可視區域寬度 alert($(document).width());//瀏覽器時下窗口文檔對于象寬度 alert($(document.body).width());//瀏覽器時下窗口文檔body的高度 alert($(document.body).outerWidth(true));//瀏覽器時下窗口文檔body的總寬度 包括border padding margin alert($(document).scrollTop()); //獲取滾動條到頂部的垂直高度 alert($(document).scrollLeft()); //獲取滾動條到左邊的垂直寬度查看全部
-
在jQuery中， width()方法用于獲得元素寬度； innerWidth()方法用于獲得包括內邊界（padding）的元素寬度， outerWidth()方法用于獲得包括內邊界(padding)和邊框(border)的元素寬度，如果outerWidth()方法的參數為true則外邊界(margin)也會被包括進來，即獲得包括外邊框(margin)、內邊界(padding)和邊框(border)的元素寬度。 同理，innerHeight方法與outerHeight方法也是用同樣的方法計算相應的高度。 所以說：對于同一個元素應該是：width()<=innerWidth()<=outerWidth()<=outerWidth(true);查看全部
-
元素下的第一個子元素查看全部
-
元素下的第一個子元素查看全部
-
//定義函數getByClass()實現獲取document或指定父元素下所有class為on的元素 function getByClass(clsName, parent){ var oparent=parent?document.getElementById(parent):document; var objs=oparent.getElementsByTagName("*"); var result=[]; for(var i=0;i<objs.length;i++){ var clas=objs[i].className.split(" "); for(var j=0;j<clas.length;j++){ if(clsName==clas[j]){ result.push(objs[i]); } } } console.log(result); return result; }查看全部
-
function checkslide(){ var oparent=document.getElementById('main'); var obox=getByClass(oparent,'box'); var h=obox[obox.length-1].offsetTop; var top=document.documentElement.scrollTop||document.body.scrollTop; var wh=document.documentElement.clientHeight||document.body.clientHeight; console.log("h"+h+"top"+top+wh); return (h<top+wh)?true:false; }查看全部
-
onscroll事件實現瀑布流布局的圖片加載功能 【原理】 當滾動滾動條時，判斷是否要加載新的圖片，通過一個函數，返回布爾值。 需要加載的條件： 頁面最下面的元素box在視口中露出一半的高度時，開始加載。具體計算：(scrollTop+可視寬口高度)>(box.offsetTop+自身高度一半)時，加載（如圖所示）。 【知識點】 ①scrollTop標準模式和混雜模式的兼容問題。 標準模式--document.body.scrollTop 混雜模式--document.documentElement.scrollTop; 兼容的寫法：var scrollTop = document.body.scrollTop||document.documentElement.scrollTop; ②當前瀏覽器的可視窗口的高度 標準模式--document.body.clientHeight 混雜模式--document.documentElement.clientHeight; ③三元運算符代替if..else(比較簡便) ④數據加載：將來自后臺的json數據渲染到前端 創建元素,將數據填進去（這里是img的src） ⑤document.createElement創建元素 parentObj.appendChild(obj);插入對象到尾部查看全部
-
重新封裝getElementsByClassName和indexOf為了照顧低版本IE.查看全部
-
@瀑布流布局----2-5 JavaScript實現瀑布流布局中圖片排序 【原理】用一個數組存放每列的高度,當有新的圖片加進來時,新圖片總是加在列高最小的那一列,新圖片加進來后,數組中相應的列的高度也相應增加. 【要點】 1.求數組中最小值 Math.min()只能求一組數據的最小值，通過傳參數列表，而不是數組。 借助apply()方法,1.將數組變為參數列表，2.改變函數中this的指向(本節課用不到此功能) Math.min.apply(null,hArr); 2.求最小值在數組中的索引 封裝函數getIndex 3.圖片定位(兩種方法) position:absolute; top:minH+’px’; 1).left:oBoxW.index+’px’; 2).left:oBoxs[index].offsetLeft+’px’; 4.存放offsetHeight的數組值hArr要不斷更改 在每次加入新圖片后，最小高度的box加上定位在其下的box的offsetHeight ；即：hArr[index]+=oBoxs[i].offsetHeight;查看全部
-
**offsetWidth屬性包括padding在內的寬度，而不是元素的width值** offsetWidth = 內容寬度 + 內邊距寬度×2 +邊框寬度×2 【不包括外邊距margin】 要點： 1.封裝瀑布流的函數waterfall 2.封裝通過className獲取元素集的函數 （原因：因為ie8以下不兼容classname，所以要封裝一個函數來獲取，如果存在多個className的情況，那么if(oElements[i].className.split(" ").indexOf(className)!==-1){……} 進行判斷就OK了。如圖） 3.計算一行顯示的列數，父級寬度/box的offsetWidth，注意取整Math.floor； var cols = Math.floor(document.documentElement.clientWidth / oBoxWidth); （獲取頁面可見寬度可能會出現兼容問題，可用var h = window.innerHeight || document.documentElement.clientWidth || document.body.clientWidth; //Width,Height同理） 4.obj.style.cssText ="",以字符串的形式設置多個樣式查看全部
-
監視瀏覽器窗口大小改變可以用window.onresize查看全部
-
var txtarr = all[i].className.split(" "); // 將數組的class分開，適用于多個類名的時候 for(var j=0; j<txtarr.length; j++){ if(txtarr[j] == classname){ arr.push(all[i]); }查看全部
-
Math.round() 功能：四舍五入取整。 Math.floor() 功能：對一個數進行下取整。 Math.ceil() 功能：對一個數進行上取整。查看全部
-
Javascript 實現瀑布流布局， 父級的應為relative 每個數據塊上的 position 屬性應定義為（absolute）查看全部
舉報
0/150
提交
取消