Jquery控制div滚动,但不显示滚动条

Jquery控制div滚动,但不显示滚动条

Html代码:

<div class="dv_phone_pic">
<div class="prew_box">
<div class="dv_icon" id="prew"></div>
    </div>
    <div id="dv_pics_box"></div>
    <div class="next_box">
<div class="dv_icon" id="next"></div>
</div>
</div>

Css样式

.dv_phone_pic{
    width: 1200px;
    height: 500px;
    margin: auto;
    background-color:#333
}
#dv_pics_box{
    width: 900px;
    height: 500px;
    margin-top:0px;
    margin-left:10px;
    margin-right:10px;
    float: left;
    overflow-y:hidden;
    overflow-x: hidden;
}
.dv_icon{
    width: 60px;
    height: 60px;
    float: left;
    cursor: pointer;
}
.prew_box{
width: 60px;
    height: 60px;
    float: left;
    margin: 240px 20px;
}
.next_box{
width: 60px;
    height: 60px;
    float: left;
    margin: 240px 20px;
}
#prew{
background-image: url("../images/pre2.png");
background-repeat: no-repeat;
}
#next{
background-image: url("../images/next2.png");
background-repeat: no-repeat;
}


JS代码:

var jsonArray=eval(data.message.imgs);
var picCount=jsonArray.length;
var boxWidth=picCount*300;
console.log("box Width: "+boxWidth);
var t=' <div class="dv_phone_pic_content" style="width:'+boxWidth+'px">';
for(Picitem in jsonArray){
var img=jsonArray[Picitem];
console.log("imgs Item:"+img);
t+='<img class="img_app_pic_item" src="' + img + '"/>';
}
t+='</div>';
$("#dv_pics_box").html(t);

说明:我的图片是从网络获取的,有多张。

效果展示图:



你可能感兴趣的:(html,div,滑动)