<style>
.lj{width:100px;height:100px;background:#990000;position:absolute;
top:400px;left:-60px;z-index:99;cursor:pointer;}
.lj.lj-is-visible{position:fixed;top:10px;}
</style>
<body style="height:2000px;">
<div class="lj" >
</div>
<script type="text/javascript">
$(window).scroll(function(){
($(this).scrollTop()>420)?$('.lj').addClass('lj-is-visible'):$('.lj').removeClass('lj-is-visible');
});
if(document.body.clientWidth<=800){
$('.lj').mouseenter(function(){$('.lj').stop().animate({left:'20'},500);});
$('.lj').mouseleave(function(){$('.lj').stop().animate({left:'-60'},1000);});
}
else{ $('.lj').css("left","20px"); }
</script>
</body>
实现2个功能：
1、当滚动像素大于420时，对div的样式添加lj-is-visible样式，否则只应该lj样式;
2、当前窗体的宽度少于800px时，对div应用mouseenter和mouseleave事件，当大于800px时，直接定义div的left值
注：要加载jQuery.js代码
373
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
