创建移轴效果的一款js

所属分类:媒体-图片展示

 30104  327  查看评论 (0)
分享到微信朋友圈
X
创建移轴效果的一款js ie兼容11

使用方法


引入css文件和js文件

<link rel="stylesheet" href="example/example.css">
<link rel="stylesheet" href="jquery.tiltShift.css">
<script src="http://libs.baidu.com/jquery/1.7.1/jquery.min.js"></script>
<script src="jquery.tiltShift.js"></script>
<!-- tiltShift plugin start -->
<script>
       jQuery(document).ready(function() {
            $('.tiltshift').tiltShift();
        });
</script>
<img src="url" class="tiltshift" data-position="50" data-blur="2" data-focus="10" data-falloff="10" data-direction="y">


更多详细用法及说明可参考官方网站


相关插件-图片展示

jQuery移动端对图片进行拖拽与旋转等操作

选着一个背景模板 然后对图片进行拖拽或者旋转一个角度 或者放大和缩小 进行调整 然后保存下来
  图片展示
 25461  303

Apple TV的海报视差效果

CSS和jQuery重现这种现象
  图片展示
 32428  419

HTML5/CSS3超酷焦点图特效

焦点图插件切换效果比较简单,但是外观和功能却十分强大。该CSS3焦点图在切换图片时,图片以淡入淡出的方式缩小消失并显示下一张图片。焦点图插件还拥有一套非常大气的前后翻页按钮,是一款非常实用HTML5/CSS3焦点图应用。
  图片展示
 32709  306

JQUERY全屏撕裂幻灯片-FULLSCREEN-SLIT-SLIDER

fullscreen-slit-slider由 jQuery 和 css3 打造而成。为我们提供了一个全屏的撕裂效果的幻灯片,接下来我就为大家讲解以下相关的用法。
  图片展示
 44974  421

讨论这个项目(0)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复