jQuery 3D倾斜滚动页面效果

当前位置:主页 > jQuery库 > 图片效果 > jQuery 3D倾斜滚动页面效果
jQuery 3D倾斜滚动页面效果
分享:

    插件介绍

    tiltedpage-scroll是一款奇妙的jQuery图片效果插件。这个图片效果插件在你滚动页面的时候图片产生3d倾斜,整个页面看上去十分有空间感。

    浏览器兼容性

    浏览器兼容性
    时间:2014-10-24
    阅读:

简要教程

tiltedpage-scroll是一款十分美妙的jQuery 3D倾斜图片插件。使用这个插件你可以做成一个很漂亮的3d倾斜图片滚动效果。

HTML结构

<div class="main">
  <section class="page1">
    ...
  </section>
  <section class="page2">
    ...
  </section>
  ...
  <section class="last-page">
    ...
  </section>
</div>
                

调用方法

首先要引入jQuery和 jquery.tiltedpage_scroll.js

 $(".main").tiltedpage_scroll({
    sectionContainer: "> section",     // In case you don't want to use <section> tag, you can define your won CSS selector here
    angle: 50,                         // You can define the angle of the tilted section here. Change this to false if you want to disable the tilted effect. The default value is 50 degrees.
    opacity: true,                     // You can toggle the opacity effect with this option. The default value is true
    scale: true,                       // You can toggle the scaling effect here as well. The default value is true.
    outAnimation: true                 // In case you do not want the out animation, you can toggle this to false. The defaul value is true.
  });
                

更多信息:https://github.com/peachananr/tiltedpage_scroll

贵州快3

免责声明: 本站资料及图片来源互联网文章,本网不承担任何由内容信息所引起的争议和法律责任。所有作品版权归原创作者所有,与本站立场无关,如用户分享不慎侵犯了您的权益,请联系我们告知,我们将做删除处理!