
一款非常大气的全屏网站切换特效,点击顶部固定导航菜单链接自动切换到对应内容的jQuery全屏页面滚动导航切换效果。
js代码
<script type=\"text/javascript\" src=\"js/jquery-1.11.2.min.js\"></script>
<script type=\"text/javascript\" src=\"js/jquery.mousewheel.min.js\"></script>
<script type=\"text/javascript\">
$(function() {
var nowpage=0;
var lock=true;
function donghua(){
$(\'.containter\').animate({\'top\': -100*nowpage+\'%\'}, 500);
$(\'.page\').eq(nowpage).addClass(\'current\').siblings().removeClass(\'current\');
$(\'.dian ul li\').eq(nowpage).addClass(\'da\').siblings().removeClass(\'da\');
$(\'.nav ul li\').eq(nowpage).addClass(\'bg\').siblings().removeClass(\'bg\');
}
$(document).mousewheel(function (event,delta) {
if(lock){
nowpage=nowpage-delta;
if(nowpage<0){nowpage=0;}
if(nowpage>4){nowpage=4;}
donghua();
lock=false;
setTimeout(function () {
// body...
lock=true;
},1000);
}
})
$(\'.nav ul li\').click(function(event) {
nowpage=$(this).index();
if(nowpage<=4){donghua();}
});
$(\'.dian ul li\').click(function(event) {
nowpage=$(this).index();
donghua();
});
});
</script>










暂无评论内容