最新赞助活动温馨提示:9.9元终身VIP,学生和没有工作的整站资源免费下载!
头像

jQuery+multiscroll鼠标滚动全屏图

来源:http://www.erdangjiade.com/ 二当家的 2015-06-13 08:47浏览(1473)

本文将演示波兰斯柯达野帝页面的全屏图效果。具体鼠标滚动效果请到演示页面查看。

1、请不要问“在不在”之类的问题,有问题直接问!2、学生或暂时没有工作的童鞋,整站资源免费下载!3、¥9.9充值终身VIP会员,整站资源无任何限制下载!5、程序员加油,交流群:782128964 在线 充值

jQuery+multiscroll鼠标滚动全屏图
分类:图片代码 > 图片轮播 难易:中级
查看演示 下载资源: 106

关注微信号获取此Demo视频教程:

下载资源 下载积分: 30 积分

HTML

<div class="ms-section ms-section3">
    <div class="txt2">
        <h2>Nowe <span>REFLEKTORY</span> <span>i design</span></h2>
        <h3>SUV的惊心动魄的一天晚上</h3>
        <p>斯柯达野帝加入了新一代斯柯达车型,其动感的设计已经赢得了认可和普及。成熟的自信得到外表现。</p>
        <a class="button btn3l" href="javascript:">开灯</a>
    </div>
</div>
<div class="ms-section ms-section4">
</div>
<div class="ms-section ms-section5">
    <div class="txt2">
        <h2>Nowe <span>REFLEKTORY</span> <span>i design</span></h2>
        <h3>SUV的惊心动魄的一天晚上</h3>
        <p>斯柯达野帝加入了新一代斯柯达车型,其动感的设计已经赢得了认可和普及。成熟的自信得到外表现。</p>
        <a class="button" href="javascript:">一个按钮</a>
    </div>
</div>

引入jQuery库、动画和multiscroll插件

<script src="js/jquery.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/jquery.multiscroll.min.js"></script>
$('#erdangjiade-Wrap').multiscroll({
     verticalCentered: false
});

页面加载时的 Loading 效果

$(window).load(function() {
    window.setTimeout(function() {
        $('body').removeClass('loading');
    }, 300);
});
声明:本文为原创文章,如需转载,请注明来源erdangjiade.com并保留原文链接:https://www.erdangjiade.com/js/188.html
评论0
头像

友情提示:垃圾评论一律封号 最新福利:领取阿里云限量2000通用代金券

1 2