*{margin:0;padding:0;}
img{
margin:10px auto;
display: block;
}
.ads{
width:100px;
height:500px;
background-color: orange;
position: absolute;
left:0;
top:0;
}
.ads span{
position:absolute;
left:0;
top:0;
font-size: 30px;
cursor: pointer;
}
.ad-right{
right:0;
left:auto;
}
$(function(){
var $ad = $('.ads');
var win_height = $(window).height();
var ad_height = $ad.height();
var scroll_fun = function(){
var ad_top = $(window).scrollTop()+(win_height-ad_height)/2;
$ad.stop(true).animate({top:ad_top}, 500);
}
scroll_fun();
//当窗口滚动的时候,让小广告位于窗口的垂直的中央
$(window).scroll(scroll_fun);
//当单击关闭的时候,关闭广告
$('.ads span').click(function(){
$(this).parent().hide(500);
});
})
一键复制
编辑
Web IDE
原始数据
按行查看
历史