发表于: 2018-09-04 21:33:44
3 754
1、今日完成任务六:继续完善任务六
2、今日遇到的问题:
主要是上次提交师兄指出的不符合要求的地方
1、小屏幕里面可以一直右滑,滚动条出现了
解决方法:在main里边加一个 overflow:hidden
2、小屏幕没有省略号
解决方法:在date里边加入以下属性:
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
效果:
3、顶部的层次有问题
解决方法:在顶部header里边加入:z-index:999;
4、用css模拟下拉选框不符合要求
解决方法:加入了一段js
$(function(){
getClick("location");
getClick("bed-and-board");
getClick("pation-condition");
});
function getClick(a){
$("."+a + " " + ".input_in").on('click',function(e){
if($("."+a + " " + '.city').is('.hide')){
$("."+a + " " + '.city').removeClass('hide');
}else{
$("."+a + " " + '.city').addClass('hide');
}
$(document).one("click",function(){
$("."+a + " " + ".city").addClass("hide");
})
e.stopPropagation();
})
$("."+a + " " + '.city li').on('click',function(){
$("."+a + " " +'.input_in .value').text($(this).html());
$("."+a + " " + '.city').addClass('hide');
})
$("."+a + " " + 'ul li').hover(
function(){
$(this).css({'backgroundColor':'#fd9','font-size':'1.320755rem'});
},function(){
$(this).css({'backgroundColor':'#fff','font-size':'1.220755rem'});
}
)
}
今日收获:暂无
明日任务:领取任务七
评论