网页设计已经提升到一个整体新的水平，Flash 渐渐失去了地位，逐渐被 HTML/JavaScript/CSS 所超越，而且一样可以实现出 Flash 复杂的特效。

本文介绍 8 个让人印象深刻的网站视觉效果，这些效果都是采用纯 JavaScript 实现的。

Viens La

该网站通过你的滚动来显示微妙的动画。

Joint London

超简约的设计与独特的导航系统。

Lena Sanz

一个视觉丰富的摄影网站，有一个巨大的响应滑块。

Skull Candy

视差的不同类型，根据预定义的路径滚动。

Black Negative

全屏幕动画背景与拖动的导航菜单。

Matte Ozanga

利用鼠标拖动，通过2个选项来欢迎用户的页面。

Angrybird Space

类似骷髅糖果，这愤怒的小鸟网站使用激进的视差的方法，该网站通过预定义的路径滚动。

Olivers Taub

这可能是一个典型的Flash网站。通过使用选项框，它创建一个最小不失优雅的解决方案。

Nature Valley Trail View

它使用全屏方式传送登陆页面。

via queness/oschina

9个让人印象深刻的网站 JS 视觉效果的更多相关文章

  1. 【转】让开发变得简单一点- Visual Studio 2010几个让人印象深刻的新功能

    原文网址:http://xhinker.blog.51cto.com/640011/313055/ 引言 "我们的目标,不仅仅是做出几个新功能,而是要回答一个问题:'如何让现在的开发人员生活 ...

  2. Skytte：一款令人印象深刻的 HTML5 射击游戏

    Skytte 是一款浏览器里的 2D 射击游戏.使用 Canvas 元素和大量的 JavaScript 代码实现.Skytte 是用我们的开源和现代的前端技术创造的.经典,快节奏的横向滚动射击游戏,探 ...

  3. 25个让人无法抗拒的HTML5网站设计实例

    原文地址:http://www.goodfav.com/html5-website-designs-8272.html HTML5在其功能方面给网络市场带来了惊人的改进. HTML5是万维网联盟,在起 ...

  4. Rhino+envjs-1.2.js 在java运行网站js 工具类

    java爬虫遇到个页面加密的东西,找了些资料学习学习 做了个java运行js的工具类,希望对大家有用,其中用到client(获取js)可以自行换成自己的client.主要是用了 Rhino就是Java ...

  5. 网站JS控制的QQ悬浮

    这是一个网站JS控制的QQ悬浮客服:代码1document.writeln("<div id=\"feedback\"><div id=\"f ...

  6. 使用PHP和GZip压缩网站JS/CSS文件加速网站访问速度

    使用PHP和GZip压缩网站JS/CSS文件加速网站访问速度 一些泛WEB 2.0网站为了追求用户体验,可能会大量使用CSS和JS文件.这就导致在服务器带宽一定的情况下,多用户并发访问速度变慢.如何加 ...

  7. 转：Java开发牛人十大必备网站

    原文来自于:http://www.importnew.com/7980.html 以下是我收集的Java开发牛人必备的网站.这些网站可以提供信息,以及一些很棒的讲座, 还能解答一般问题.面试问题等.质 ...

  8. 除了Udacity，全球最聪明的那群人还上哪些网站？

    01. ***,与世界相连 WikiWand——打开维基百科的新方式 http://www.wikiwand.com/ InsightfulQuestions(subreddit)——跨越界限的智力讨 ...

  9. 印象深刻的bug

    测试中测到一个印象比较深刻的bug,问题出现在web端的电商平台,展示商品的时候每点击一个商品相应的url=~/productid.html,如果知道productid可以直接在url输入跳转到商品详 ...

随机推荐

  1. Google LOGO现代舞舞蹈动画

    效果预览:http://hovertree.com/texiao/js/5.htm 截图: HTML文件代码: <!DOCTYPE html> <html xmlns="h ...

  2. 深入JavaScript：词法分析、连续赋值猜想

    JavaScript:词法分析.连续赋值猜想 原创文章,转摘请注明出处:苏福:http://www.cnblogs.com/susufufu/p/5851642.html 深夜发文,先吐槽下博客园的编 ...

  3. windows下React-native 环境搭建

    公司决定试水react-native,mac审批还没下来,没办法,先用windows硬着头皮上吧. 参考文章: React Native 中文网官方文档 史上最全Windows版本搭建安装React ...

  4. Android开发重点难点1：RelativeLayout(相对布局)详解

    前言 啦啦啦~博主又推出了一个新的系列啦~ 之前的Android开发系列主要以完成实验的过程为主,经常会综合许多知识来写,所以难免会有知识点的交杂,给人一种混乱的感觉. 所以博主推出“重点难点”系列, ...

  5. android TextView多行文本(超过3行)使用ellipsize="end"属性无效问题的解决方法

    <TextView android:id="@+id/desc" android:layout_width="match_parent" android: ...

  6. Linux－1:安装&忘记密码&CRT连接centos 6.5

    我是在虚拟机VM安装的centos 6.5 一.Linux安装 Ctrl + Alt:鼠标退出LINUX界面 安装我是参考,当然也可以根据网上教程安装:http://oldboy.blog.51cto ...

  7. Why Do We Need a Data Warehouse?

    https://dwbi1.wordpress.com/2012/12/03/why-do-we-need-a-data-warehouse/ 经常有人来质疑数据仓库的价值,为什么我们需要花费一年多的 ...

  8. Shell : debug

    调试shell脚本的方法: 使用命令:sh -x yourShell.sh

  9. (转载)SQL Reporting Services (Expression Examples)

    https://msdn.microsoft.com/en-us/library/ms157328(v=SQL.100).aspx Expressions are used frequently in ...

  10. x01.os.20: compile linux-0.11 on the ubuntu

    为什么学习 linux 正如不能依靠美国的 GPS 为我们的导弹指示目标一样,很难想像用运行 windows 的电脑去同美国进行信息战.而朝鲜的网络崩溃,再次警示国人,信息战.网络战离我们并不遥远.l ...