为了账号安全,请及时绑定邮箱和手机立即绑定

为啥oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto'; 有效果,但不居中

为啥oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto'; 有效果,但是不居中

撤掉margin:0 auto  结果会更加偏左

但加上后,稍微向右移,但不居中

而且显示6,但实际只有5列

http://img1.sycdn.imooc.com//58a973480001faf519171008.jpg

---------------------css代码------------------------

*{margin:0;

  padding:0;}

  #main{position:relative;}


  .box{padding:15px 0 0 15px;

  float:left;}


  .pic{padding:10px;

  border:1px solid #CCC;

  border-radius:5px;

  box-shadow:0 0 5px #CCC;}


  .pic img{width:165px;

  height:auto;}


---------------------script代码----------------------

window.onload=function(){

waterfall("main","box");

}


function waterfall(parent,box){

//将mian下的所有class为box的元素取出来

var oParent=document.getElementById(parent);

var oBoxs=getByClass(oParent,box);

//计算整个页面显示的页数(页面宽/box的宽)

var oBoxW=oBoxs[0].offsetWidth;

var cols=Math.floor(document.documentElement.clientWidth/oBoxW);

//设置Main的宽

// oParent.style.cssText="width:"+oBoxW*cols+"px; margin:0 auto";//margin:0 auto

console.log("123");

oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto';

}


//根据Class获取元素

function getByClass(parent,clsName){

var boxArr=new Array(), //用来存储获取到的class为box的元素

oElements=parent.getElementsByTagName("*");

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

if(oElements[i].className==clsName){

boxArr.push(oElements[i]);

}

}

return boxArr;

}

---------------------html代码-----------------------

window.onload=function(){

waterfall("main","box");

}


function waterfall(parent,box){

//将mian下的所有class为box的元素取出来

var oParent=document.getElementById(parent);

var oBoxs=getByClass(oParent,box);

//计算整个页面显示的页数(页面宽/box的宽)

var oBoxW=oBoxs[0].offsetWidth;

var cols=Math.floor(document.documentElement.clientWidth/oBoxW);

//设置Main的宽

// oParent.style.cssText="width:"+oBoxW*cols+"px; margin:0 auto";//margin:0 auto

console.log("123");

oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto';

}


//根据Class获取元素

function getByClass(parent,clsName){

var boxArr=new Array(), //用来存储获取到的class为box的元素

oElements=parent.getElementsByTagName("*");

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

if(oElements[i].className==clsName){

boxArr.push(oElements[i]);

}

}

return boxArr;

}


正在回答

2 回答

我看了一遍没看出问题... 你的html代码检查了吗 id名字有没有写错

0 回复 有任何疑惑可以回复我~
#1

小明菌 提问者

换了其它浏览器又正常了
2017-03-09 回复 有任何疑惑可以回复我~

http://img1.sycdn.imooc.com//598574970001579c14400900.jpg


一样的问题,为什么啊啊啊啊啊啊 ???

明明没有padding和margin,右边就是空了一节???

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

举报

0/150
提交
取消

为啥oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto'; 有效果,但不居中

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信