>웹 프론트엔드 >JS 튜토리얼 >놀라운 시차 스크롤 효과를 구현하는 데 도움이 되는 6개의 jQuery 플러그인_jquery

놀라운 시차 스크롤 효과를 구현하는 데 도움이 되는 6개의 jQuery 플러그인_jquery

WBOY
WBOY원래의
2016-05-16 17:50:171029검색

在网页设计中,视差滚动(Parallax Scrolling)是当下流行的网页设计技术,通过让多层背景以不同的速度或者不同的方向移动来形成非常有趣的 3D 运动效果。下面是一些运用视差滚动效果的优秀网页案例:

视差(Parallax)是指从不同的点看一个物体时形成的视觉差异,这个名词是源自希腊文的παράλλαξις (parallaxis),意思是"改变"。在网页设计中,视差滚动(Parallax Scrolling)是当下流行的网页设计技术,通过让多层背景以不同的速度或者不同的方向移动来形成非常有趣的 3D 运动效果。下面是一些运用视差滚动效果的优秀网页案例:

  相信你非常想知道上面这些网页的精美视差滚动效果是如何实现的,今天这篇文章就和大家分享六款精心挑选的 jQuery 视差滚动效果插件,它们能够帮助你制作出精美的视差滚动效果。

 

Sequence.js

Sequence 是一款非常优秀的 jQuery 滑动插件,能实现多种精美的滑动效果,其中之一就是水平方向的视差滚动。

 

 

在线演示  下载源码

 

jQuery Scroll Path

这款插件用于实现自定义路径的滚动效果。可以显示使用 Canvas 绘制路径线条和弧形,看到非常形象的运动效果。

 

 

在线演示  下载源码

 

Parallax Slider with jQuery

这个视差滚动滑动效果多次在我的博文中出现过,相信关注我博客的朋友一定不会陌生,有非常详细的制作教程

 

 

在线演示  下载源码

 

jQuery Parallax

这款 jQuery 插件实现了类似 Nikebetterworld.com 产品展示页面的视差滚动效果,代码托管在 Github 上面。

 

 

在线演示  下载源码

 

Scrollorama

这款 jQuery 插件能够帮助你实现非常酷的滚动效果,可以应用飞入、缩放、淡入淡出等多种过渡效果。

 

 

온라인 데모 소스 코드 다운로드

Stellar.js

슬로건에 따르면 시차 스크롤 효과를 얻는 것이 그 어느 때보다 쉬웠습니다. 실제로 웹 페이지에서 시차 스크롤 효과를 쉽게 얻는 데 도움이 될 수 있습니다.

온라인 데모 소스 코드 다운로드

j시차

이 jQuery 기반 시차 스크롤 플러그인은 사용하기 쉽고 공식적으로 다섯 가지 효과 데모를 제공합니다.

온라인 데모 소스 코드 다운로드
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.