滚动视差网站工具与教程

滚动视差绝对是今年最炫的设计风格，也是最近的设计趋势，之前我们分享了《60多个超炫的视差滚动效果网站设计欣赏》相信让很多人都耳目一新，现在整理几个比较不错的开源滚动视差项目，它们大都托管在github上，大家可以用在自己的项目中，当然，从中获取灵感自己开发会更好～～

Scrollorama

curtain.js

jQuery-Parallax

stellar.js

jparallax

Skrollr

Parallax.js

A Simple Parallax Scrolling Technique via Nettuts+

恩，先就这些，如果你有发现其它关于滚动视差的开源项目或实现教程，欢迎与我们分享。

整理自：http://webdesignledger.com/tools/parallax-tools-and-techniques
中文原文：滚动视差网站工具与教程
请尊重版权，转载请注明来源，多谢～～

时间： 2024-10-24 16:53:23

滚动视差网站工具与教程的相关文章

2013网页设计趋势:滚动视差网站设计

文章描述:网页特效:滚动视差设计指南. 作为未来网页设计的热点趋势之一的"滚动视差"在近年来被越来越多网站所采用,特殊新颖的展示模式也让许多用户眼前一亮.网络上也如雨后春笋一般出 现了很多像<30个让人兴奋的视差滚动网站>.<60个视差滚动网站赏析>--等一系列的视差滚动的文章,不过赏析的居多,真正指导设计师如何去设计,如 何去实现的实用型文章却很少.于是萌发了自己写一篇的想法,与感兴趣的人共同交流下滚动视察设计时的一些心得. 什么是滚动视差?视差滚动(Para

网站设计：什么是滚动视差？ 滚动视差设计指南

作为未来网页设计的热点趋势之一的"滚动视差"在近年来被越来越多网站所采用,特殊新颖的展示模式也让许多用户眼前一亮.网络上也如雨后春笋一般出现了很多像<30个让人兴奋的视差滚动网站>.<60个视差滚动网站赏析>--等一系列的视差滚动的文章,不过赏析的居多,真正指导设计师如何去设计,如何去实现的实用型文章却很少.于是萌发了自己写一篇的想法,与感兴趣的人共同交流下滚动视察设计时的一些心得. 什么是滚动视差? 视差滚动(Parallax Scrolling)是指让多层背

网页特效滚动视差设计指南

  什么是滚动视差? 视差滚动(Parallax Scrolling)是指让多层背景以不同的速度移动,形成立体的运动效果,带来非常出色的视觉体验. 视差效果,原本是一个天文学术语,当我们观察星空时,离我们远的星星移动速度较慢,离我们近的星星移动速度则较快.当我们坐在车上向车窗外 看时,也会有这样的感觉,远处的群山似乎没有在动,而近处的稻田却在飞速掠过.许多游戏中都使用视差效果来增加场景的立体感.说的简单点就是网页内的元素 在滚动屏幕时发生的位置的变化,然而各个不同的元素位置变化的速度不同,导致网

Android开发工具GenyMotion教程

好长时间没有再接触Android了,以至于GenyMotion出现这么久了,我还没有试用过,记得当时发布 Android Studio时,当天我就开始试用了,好吧,看到GenyMotion这个东西还要归功于这篇文章: http://blog.csdn.net/chichoxian/article/details/9224793,看了这篇文章之后,才知道这个东西,才开 始试用这个东西. 首先,我们需要做的第一步是去这个网站下载软件安装包: https://cloud.genymotion.com/

JS模块化工具requirejs教程：requirejs学习笔记

随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求. JS模块化工具requirejs教程(一):初识requirejs-安全者 RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一.最新版本的RequireJS压缩后只有14K,堪称非常轻量.它还同时可以和其他的框架协同工作,使用RequireJS必将使

手把手教您制作一个完整网站(内附教程)

手把手教您制作一个完整网站(内附教程) 1.搞个简单的策划先. 至少应该有一个大概的方向吧,先确定网站的类型,是地区门户.行业门户,还是下载.电影.论坛等等.然后基本确定网站的名称. 2.找一个合适的域名. 域名注册.com(国际域名)和.cn(国内域名)为宜,域名最好不要太长.且有一定的意义.容易记,现在好的域名已经不多了,你可灵活的使用数字.英文单词.拼音等的组合,在域名的前.后加上i.e.51.ok.hao.88.163等,可以灵活的组合出许多好的域名.域名注册信息查询 http://ww

Photoshop网站界面设计教程:设计杂志网站界面

本教程来自:photoshoplady.com如需转载 请务必以超链接形式注明:来自活力盒子网站以及原文出处.水平有限,翻译难免有误,请有心的朋友给予指出,以方便更多朋友阅读. 这是我众多网站界面设计教程中的一个,是专门为10Steps.sg写的.我们要兼顾整个页面的美感,在动手设计杂志网站界面之前要做细致的设计规划.希望本教程会为你以后的项目设计带来帮助. 最终效果预览 下面让我们用线框来着手布局.下图就是我们绘制的简单布局,这么做的目的是要确定每个元素的位置.确定主导航栏包含几个部分.以及最

启发你的设计灵感 12个水平滚动的网站设计

从前,水平滚动被认为是不好的,但是现在在网页设计中,它被作为一种独特的方法(通常用于展示),而且貌似在大多数情况下,它的确是以一种聪明的方法来实现.水平滚动并不适用于所有情况,但是一旦处理得当,它将让一个网站鹤立鸡群,看完这些例子后,你将看到它是如何实现有趣的界面的. 在这里网页教学网整理了12个水平滚动的网站设计,以启发你的灵感.或许这种风格符合你的观点,它能够让你的网站引人注目. 1.) Vanty Claire 2.) We Shoot Bottels 3.) Artist in Desi

WEBJX收集18个良好的在线配色调试网站工具

好的配色,很大程度上决定着一个网站设计的质量好坏,合理地选择合适的色彩搭配,契合网站设计目的的同时,可以更确切地传达网站产品要表达的内容和思想,除了平时使用的Web设计软件意外,更多地掌握一个在线配色调试工具,会给你的工作起到事半功倍的效果,节约工作成本.这里就为Web设计师整理了18个优秀的在线配色调试网站工具. Adobe Kuler Colr.org Colour Lovers 4096 Color Wheels Color Schemer Color Palette Generator