基于html5顶部导航3D翻转展开特效
基于html5顶部导航3D翻转展开特效是一款基于jQuery+HTML5实现的3D翻转网站导航菜单代码。效果图如下:

实现的代码。
html代码:
<header class="cd-header">
<a href="#0" class="cd-logo"><img src="img/cd-logo.svg" alt="Logo"></a>
<a href="#0" class="cd-3d-nav-trigger">
Menu
<span></span>
</a>
</header> <!-- .cd-header --> <main>
<h1>3D Rotating Navigation</h1>
<!-- all your content here -->
</main> <nav class="cd-3d-nav-container">
<ul class="cd-3d-nav">
<li class="cd-selected">
<a href="#0">Dashboard</a>
</li> <li>
<a href="#0">Projects</a>
</li> <li>
<a href="#0">Images</a>
</li> <li>
<a href="#0">Settings</a>
</li> <li>
<a href="#0">New</a>
</li>
</ul> <!-- .cd-3d-nav --> <span class="cd-marker color-1"></span>
</nav> <!-- .cd-3d-nav-container --> <script type="text/javascript" src="js/jquery-2.1.1.js"></script>
<script type="text/javascript" src="js/main.js"></script>
via:http://www.w2bc.com/article/49439
基于html5顶部导航3D翻转展开特效的更多相关文章
- 基于css3的文字3D翻转特效
一款基于css3的文字3D翻转特效.这款特效当鼠标经过文字的时候3D翻转显示阴影.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class="compo ...
- 基于HTML5的燃气3D培训仿真系统
最近上线了的基于HTML5的燃气3D培训仿真系统,以前的老系统是采用基于C++和OpenGL的OpenSceneGraph引擎设计的,OSG引擎性能和渲染效果各方面还是不错的,但因为这次新产品需求要求 ...
- 基于 HTML5 的 WebGL 3D 档案馆可视化管理系统
前言 档案管理系统是通过建立统一的标准以规范整个文件管理,包括规范各业务系统的文件管理的完整的档案资源信息共享服务平台,主要实现档案流水化采集功能.为企事业单位的档案现代化管理,提供完整的解决方案,档 ...
- 基于HTML5手机上下滑动翻页特效
基于HTML5手机上下滑动翻页特效.这是一款手机移动端触屏滑动翻页代码下载.效果图如下: 在线预览 源码下载 实现的代码. html代码: <section class="u-al ...
- 基于html5海贼王单页视差滚动特效
分享一款基于html5海贼王单页视差滚动特效是一款流行滑落网页特效代码.效果图如下: 在线预览 源码下载 实现的代码: <div class="top"> < ...
- 基于 HTML5 WebGL 的 3D 风机 Web 组态工业互联网应用
基于 HTML5 WebGL 的 3D 风机 Web 组态工业互联网应用 前言 在目前大数据时代背景之下,数据可视化的需求也变得越来越庞大,在数据可视化的背景之下,通过智能机器间的链接并最终将人机链接 ...
- 基于 HTML5 Canvas 的 3D 机房创建
对于 3D 机房来说,监控已经不是什么难事,不同的人有不同的做法,今天试着用 HT 写了一个基于 HTML5 的机房,发现果然 HT 简单好用.本例是将灯光.雾化以及 eye 的最大最小距离等等功能在 ...
- 基于 HTML5 WebGL 的 3D 机房
前言 用 WebGL 渲染的 3D 机房现在也不是什么新鲜事儿了,这篇文章的主要目的是说明一下,3D 机房中的 eye 和 center 的问题,刚好在项目中用上了,好生思考了一番,最终觉得这个例子最 ...
- 基于 HTML5 Canvas 的 3D WebGL 机房创建
对于 3D 机房来说,监控已经不是什么难事,不同的人有不同的做法,今天试着用 HT 写了一个基于 HTML5 的机房,发现果然 HT 简单好用.本例是将灯光.雾化以及 eye 的最大最小距离等等功能在 ...
随机推荐
- Redis 集群_主从配置_哨兵模式
首先:slaveof 可以在[从]服务器启动一个service服务,直接将[从]服务器定义为[从Redis] redis-server --slaveof <master-ip> < ...
- 【Servlet】java web 文件下载功能实现
需求:实现一个具有文件下载功能的网页,主要下载压缩包和图片 两种实现方法: 一:通过超链接实现下载 在HTML网页中,通过超链接链接到要下载的文件的地址 <!DOCTYPE html> & ...
- 技术的正宗与野路子 c#, AOP动态代理实现动态权限控制(一) 探索基于.NET下实现一句话木马之asmx篇 asp.net core 系列 9 环境(Development、Staging 、Production)
黄衫女子的武功似乎与周芷若乃是一路,飘忽灵动,变幻无方,但举手抬足之间却是正而不邪,如说周芷若形似鬼魅,那黄衫女子便是态拟神仙. 这段描写出自<倚天屠龙记>第三十八回. “九阴神抓”本是& ...
- Android逆向之旅---破解"穿靴子的猫"游戏的收费功能
一.游戏收费分析 游戏收费非常正常的,可是玩游戏最恶心的就是你还没玩就要充值,非常恼火,事实上我不怎么玩游戏,主要是给小孩子们弄,比方如今好多小屁孩们喜欢玩水果忍者这个游戏.可是这个游戏在没有開始玩的 ...
- Android Studio 环境搭建参考,jdk10javac命令提示不是内部或外部命令
https://blog.csdn.net/qq_33658730/article/details/78547789 win10下Android Studio和SDK下载.安装和环境变量配置 http ...
- 常用代码之七:静态htm如何包含header.htm和footer.htm。
要实现这个有多种解决方案,比如asp, php, 服务器端技术,IFrame等,但本文所记录的仅限于用jQuery和纯htm的解决方案. <head> <title></ ...
- 增加一条新记录,同时返回其自增id
方法一.是在Insert或Update触发器中用select来返回需要的字段值.默认情况下,当insert时,触发其insert触发器,它的默认返回值是影响到的行数,语句是:select @@rowc ...
- 将Android Studio默认布局ConstraintLayout切换成LinearLayout
将Android Studio默认布局ConstraintLayout切换成LinearLayout 大部分人初次使用google android 扁平化布局ConstraintLayout都 ...
- Batch to setup JAVA programming environment for Algorithm class from priston
Original web site: http://algs4.cs.princeton.edu/linux/ Part. I [username:~/] [username:~/] mkdir al ...
- mysql在插入或更新的时候对一个字段赋递增值
在我们有一个需求是更新某个表里面的某个字段,让这个字段变成一个递增的值,或者插入某个表中使得某些字段的值是递增的.下面我们来看看具体的操作: 更改表字段为递增 首先设置一个变量,初始值为任意数值,这里 ...