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