这是一组共4种效果很炫酷的CSS3移动手机滑动隐藏側边栏菜单特效。

这四种效果各自是：默认的点击滑动側边栏菜单效果、带3D transforms的滑动側边栏效果、文字缩放和淡入淡出效果的滑动側边栏以及使用translate来实现滑动側边栏的效果。

每个滑动側边栏效果都带有从右到左淡入淡出的滑动过渡效果。

菜单条中的菜单项以一个接一个的方式显示，这样的效果是通过为它们分别加入 transition-delay
来实现的。以下来看看默认的滑动側边栏效果的制作方法。

插件中使用了font-awesome图标字体，能够点击这里查看font-awesome图标字体的參考和用法。

在线演示：http://www.htmleaf.com/Demo/201503121509.html

下载地址：http://www.htmleaf.com/css3/daohangcaidan/201503121508.html

CSS3超酷移动手机滑动隐藏側边栏菜单特效的更多相关文章

  1. 5个基于css3超炫的鼠标滑动按钮动画

    今天给大家分享5个基于css3超炫的鼠标滑动按钮动画.这5个按钮鼠标经过的时候有超炫的动画效果.这5个按钮适用浏览器:360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之 ...

  2. 基于jQuery和CSS3超酷Material Design风格滑动菜单导航特效

    分享一款效果非常炫酷的谷歌 Material Design 风格jQuery和CSS3滑动选项卡特效.该选项卡特效集合了扁平风格设计和按钮点击波特效.是一款设计的非常不错的Material Desig ...

  3. jQuery和CSS3超酷表单美化插件

     这是一款效果很精美炫酷的jQuery和CSS3联系方式表单美化插件.大多数站点上都有让用户填写的联系方式表单,一个设计良好的表单可以大大的提升用户的体验度.该表单美化插件在原生HTML表单的基础上进 ...

  4. 纯CSS3超酷3D旋转立方体动画特效

    简要教程 这是一款神奇的纯 CSS3 立方体动画特效插件.使用CSS3来制作动画效果已经成为WEB前端开发的一种时尚,从简单的颜色和尺寸动画,到复杂的旋转.翻转动画, CSS3 展现了它无穷的魅力.使 ...

  5. HTML5/CSS3超酷环形动画菜单

    在线演示 本地下载

  6. 10款基于HTML5+CSS3实现的超酷源码动画

    1.基于Bootstrap的jQuery登录表单 这是一款基于Bootstrap的登录表单,表单的外观自然不用说,沿用了Bootstrap的风格,非常漂亮.这款登录表单有一个经过CSS3处理过的头像图 ...

  7. iOS之滑动隐藏导航

    滑动隐藏导航狼栏 -(void)scrollViewDidScroll:(UIScrollView *)scrollView{ CGFloat offsetY = scrollView.content ...

  8. 【超酷超实用】CSS3可滑动跳转的分页插件制作教程

    原文:[超酷超实用]CSS3可滑动跳转的分页插件制作教程 今天我要向大家分享一款很特别的CSS3分页插件,这款分页插件不仅可以点击分页按钮来实现分页,而且可以滑动滑杆来实现任意页面的跳转,看看都非常酷 ...

  9. 9款超酷的jQuery/CSS3插件

    Article From here: http://js.itivy.com/?p=1883 1.jQuery向前滑动切换焦点图 这款jQuery焦点图非常绚丽,切换图片的时候每张图片是向前滑动的,很 ...

随机推荐

  1. thinkphp 调用函数

    1,定义为Common.php文件.自动加载. 2,配置文件config.php文件里配置'LOAD_EXT_FILE'=>'function'.则会自动加载function.php文件 3,使 ...

  2. Ubuntu10.10 安装scim

    Ubuntu10.10 上没有找到默认的输入法,所以要安装一个中文输入法,网上好多介绍的,但都 不怎么好用,下面参考http://blog.csdn.net/caodesheng110/article ...

  3. JavaScript实现命令行交互

    原文地址: http://www.cnblogs.com/liaoyu/p/js-terminal.html 周末闲着想试试用 JavaScript 模拟命令行交互的功能,希望达到的几个功能点如下: ...

  4. 分析Java的类加载器与ClassLoader（二）：classpath与查找类字节码的顺序，分析ExtClassLoader与AppClassLoader的源码

    先回顾一下classpath classpath的作用: classpath的作用是指定查找类的路径:当使用java命令执行一个类(类中的main方法)时,会从classpath中进行查找这个类. 指 ...

  5. (Deep) Neural Networks (Deep Learning) , NLP and Text Mining

    (Deep) Neural Networks (Deep Learning) , NLP and Text Mining 最近翻了一下关于Deep Learning 或者 普通的Neural Netw ...

  6. -fembed-bitcode is not supported on versions of iOS prior to 6.0 问题修复

    参考一下网址 http://stackoverflow.com/questions/30867544/fembed-bitcode-is-not-supported-on-versions-of-io ...

  7. 【转】iTunes下载速度太慢？两招帮你提速！-- 不错

    原文网址:http://bbs.app111.com/thread-275-1-1.html 不用说,很多朋友都发现在大陆,下载 iTunes 上的东西实在是慢如蜗牛,小一点的软件还能坚持一下,大一点 ...

  8. 期待已久的2012年度最佳jQuery插件揭晓

    近日,国外著名博客WDL发布了2012年度最佳 jQuery 插件.jQuery 自2006年发布以来,经过6年的迅速发展,目前已是最流行和使用最广泛的 JavaScript 框架,这主要归功于众多围 ...

  9. jQuery与XML

    jQuery与XML 快而强的遍历系统,华丽丽的选择器语法,这或许是jQuery 那么流行的原因.当然它还有详尽的文档.它主要是用来处理HTML的,但在这里妳会看到如何应用到XML. 使用jQuery ...

  10. zookeeper实现分布锁

    分布式锁服务在大家的项目中或许用的不多,因为大家都把排他放在数据库那一层来挡.当大量的行锁.表锁.事务充斥着数据库的时候.一般web应用很多的瓶颈都在数据库上,这里给大家介绍的是减轻数据库锁负担的一种 ...