微博上看到这样一篇文章（http://js.itivy.com/?p=495），用jquery和css3制作左右拉伸动画菜单，看了下实现效果（http://js.itivy.com/jiaoben963/index.html），感觉用css3就够了，不需要jquery。于是尝试了下，只用css3基本上也实现了原文的效果，如下：

点击顶栏的result可以看到效果，未作浏览器兼容性优化。

css3制作左右拉伸动画菜单的更多相关文章

  1. 非常酷的CSS3垂直下拉动画菜单

    昨天我向大家介绍了一款兼容性不错的jQuery淡入淡出下拉菜单,今天要分享一款相对绚丽的CSS3垂直下拉动画菜单,不过需要支持CSS3的浏览器才能有效果.下面是效果图,一起看看. 我们也可以在这里查看 ...

  2. 利用CSS3制作淡入淡出动画效果

    CSS3新增动画属性“@-webkit-keyframes”,从字面就可以看出其含义——关键帧,这与Flash中的含义一致. 利用CSS3制作动画效果其原理与Flash一样,我们需要定义关键帧处的状态 ...

  3. CSS3/jQuery创意盒子动画菜单

    作为前端开发者,各种各样的jQuery菜单见过不少,这款jQuery/CSS3菜单却是别具一格,菜单项嵌入到九宫格中,像小盒子一样,加上温馨的背景,菜单整体外观十分可爱.点击菜单项,盒子就会展开,展示 ...

  4. 用bootstrap和css3制作按钮式下拉菜单

    利用bootstrap框架的字体图标和下拉菜单效果,以及css3的动画效果,可以做出比较优雅的按钮式下拉菜单样式 <style> .myBtnStyle .dropdown-menu sp ...

  5. 纯CSS3制作皮卡丘动画壁纸

    前言 明天就放假了,趁着今晚的空挡时间来写这篇博客——这是我昨晚实现的一个简单的CSS3动画效果.话说还得缘起我逛了一下站酷网,然后不小心看到了一张皮卡丘的手机壁纸,觉得很可爱,然后觉得这种效果是可以 ...

  6. css3 制作平滑过度动画

    -webkit-transition(属性渐变) -webkit-transition:CSS属性(none|all|属性)  持续时间  时间函数  延迟时间 CSS属性(transition-pr ...

  7. CSS3制作上下跳动动画箭头效果

    动画效果如下: 代码如下: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8&q ...

  8. CSS3 3D折叠展开动画菜单

    在线演示 本地下载

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

    在线演示 本地下载

随机推荐

  1. web 压力测试工具ab压力测试详解

    Web性能压力测试工具之ApacheBench(ab)详解 原文:http://www.ha97.com/4617.html PS:网站性能压力测试是性能调优过程中必不可少的一环.只有让服务器处在高压 ...

  2. loj #6247. 九个太阳

    求 $\sum\limits_{i=1}^n [k | i] \times C_n^i$ 膜 $998244353$ $n \leq 10^{15},k \leq 2^{20}$ $k$ 是 $2$ ...

  3. 【LeetCode】025. Reverse Nodes in k-Group

    Given a linked list, reverse the nodes of a linked list k at a time and return its modified list. k  ...

  4. Tomcat反带和集群

    Nginx|Apache反带用户请求到Tomcat LNMT: client -->http --> nginx --> reverse_proxy --> http --&g ...

  5. redis4.0.1集群安装部署

    安装环境 序号 项目 值 1 OS版本 Red Hat Enterprise Linux Server release 7.1 (Maipo) 2 内核版本 3.10.0-229.el7.x86_64 ...

  6. C语言 字符串中数字的运算

    主函数中输入字符串"32486"和"12345",在主函数中输出的函数值为44831. #include <stdio.h> #include &l ...

  7. [转载]网络虚拟化中的 offload 技术：LSO/LRO、GSO/GRO、TSO/UFO、VXLAN

    offload 现在,越来越多的网卡设备支持 offload 特性,来提升网络收/发性能.offload 是将本来该操作系统进行的一些数据包处理(如分片.重组等)放到网卡硬件中去做,降低系统 CPU ...

  8. (转)SC命令---安装、开启、配置、关闭windows服务 bat批处理

    本文转载自:http://blog.csdn.net/moruna/article/details/9190733 废话不多说,看命令行更直接! 一.直接使用cmd来进行服务的一些操作 1.安装服务 ...

  9. linux configure使用方法

    'configure'脚本有大量的命令行选项.对不同的软件包来说,这些选项可能会有变化,但是许多基本的选项是 不会改变的.带上'--help'选项执行'configure'脚本可以看到可用的所有选项. ...

  10. DCloud-MUI：HBuilder 安装

    ylbtech-DCloud-MUI:HBuilder 安装 1.返回顶部 1. 2. 3. 4. 2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   7.返 ...