亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

哪個大神可以幫我看下,為什么圖片加載不了

/*由于代碼是順序執行的,如果引入的js放在<head>標簽里面,

就需要等網頁加載完才能執行,否則實現不了想要的js效果*/

window.onload=function(){

waterfall('main','pin');

var dataInt={'data':[{'src':'1.jpg'},{'src':'2.jpg'},{'src':'3.jpg'},{'src':'4.jpg'}]};

window.scroll=function(){


var parent=document.getElementById('main');?

for(var i=0;i<dataInt.data.length;i++){

if (checkscrollside()) {

var oPin=document.createElement('div');

oPin.className='pin';

parent.appendChild(oPin);

var oBox=document.createElement('div');

oBox.className='box';

oPin.appendChild(oBox);

var oImg=document.createElement('img');

oImg.src='images/'+dataInt.data[i].src;

oBox.appendChild(oImg);


};?

waterfall('main','pin');

}?

}

}

function waterfall(Oparent,cls){

var parent=document.getElementById(Oparent);//父元素

var pinNum=getByClassname(parent,'pin');//獲取在父元素下的pin數量,也就是圖片框的數量

var pinW=pinNum[0].offsetWidth;//獲取每一個塊框pin的寬度

var num=Math.floor(document.documentElement.clientWidth/pinW);//每行能夠容納pin的個數(窗口的寬度/塊框的寬度)

parent.style.cssText='width:'+pinW*num+'px;margin:0 auto;';//設置父元素居中,并設置寬度(當瀏覽器窗口縮小時所容納的列數不變)

//用于存儲 每列中的所有塊框相加的高度。

var pinHArr=[];

for(var i=0;i<pinNum.length;i++){//遍歷數組pin的每個塊狀元素

//如果遍歷i小于num(6),也就是塊狀元素pin還處于處于第一行,沒有往第二行排列

if (i<num) {

pinHArr[i]=pinNum[i].offsetHeight;//先把第一行的六個pin高度值加入數組

}else{//如果i大于num,也就是塊狀元素往第二行排列

var minH=Math.min.apply(null,pinHArr);//獲取pinHArr數組中的最小值

var minHIndex=pinHArr.indexOf(minH);//獲取數組中最小值所在的索引

pinNum[i].style.position='absolute';//設置絕對位移

pinNum[i].style.top=minH+'px';

pinNum[i].style.left=pinNum[minHIndex].offsetLeft+'px';

pinHArr[minHIndex]+=pinNum[i].offsetHeight;//更新添加了塊狀元素的高度

}

}

}

function getByClassname(parent,className){

var elements=parent.getElementsByTagName('*');

var result=[];

for(var i=0;i<elements.length;i++){

if (elements[i].className==className) {

result.push(elements[i]);

}

}

return result;

}

function checkscrollside(){

var parent=document.getElementById('main');

var pinNum=getByClassname(parent,'pin');

var lastPinH=pinNum[pinNum.length-1].offsetTop+Math.floor(pinNum[pinNum.length-1].offsetHeight/2);

var scrollTop=document.body.scrollTop||document.documentElement.scrollTop;

var clientH=document.documentElement.clientHeight;

return (lastPinH<scrollTop+clientH)?true:false;

}



就是dataInt里面的圖片加載不了,無法實現瀑布流效果,望解答,謝謝!

正在回答

1 回答

已解決,謝謝

0 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消

哪個大神可以幫我看下,為什么圖片加載不了

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號