首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 HTML / CSS

HTML5手机端弹出遮罩菜单特效代码

Posted in HTML / CSS onJanuary 27, 2016

效果图如下所示：

HTML5手机端弹出遮罩菜单特效代码

代码如下：
XML/HTML Code复制内容到剪贴板
  1. <!doctype html>    
  2. <html lang="zh">    
  3. <head>    
  4. <meta charset="UTF-">    
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=">    
  6. <meta name="viewport" content="width=device-width, initial-scale=.">    
  7. <title>jQuery比bootstrap效果还帅的响应式模态窗口插件 - 何问起</title><base target="_blank" />    
  8. <link rel="stylesheet" href="http://hovertree.com/texiao/html//reset.css"> <!-- CSS reset -->    
  9. <link rel="stylesheet" href="http://hovertree.com/texiao/html//style.css"> <!-- Resource style -->    
  10. <!--[if IE]>    
  11. <script src="http://hovertree.com/texiao/html//htmlshiv.min.js"></script>    
  12. <![endif]-->    
  13. </head>    
  14. <body>    
  15. <div class="sucaihuo-container">    
  16. <section class="cd-section">    
  17. <a class="cd-bouncy-nav-trigger" href="javascript:;" target="_self">显示菜单</a>    
  18. </section>    
  19. <div><a href="http://hovertree.com/h/bjaf/menulayer.htm">原文</a> <a href="http://hovertree.com/">首页</a> <a href="http://hovertree.com/texiao/">特效</a> <a href="http://hovertree.com/texiao/keleyi/">向上弹出菜单</a>    
  20. </div>    
  21. <div class="cd-bouncy-nav-modal">    
  22. <nav>    
  23. <ul class="cd-bouncy-nav">    
  24. <li><a href="http://hovertree.com/">首页</a></li>    
  25. <li><a href="http://hovertree.com/menu/jquery/">jQuery</a></li>    
  26. <li><a href="http://hovertree.com/menu/php/">PHP</a></li>    
  27. <li><a href="http://hovertree.com/h/bjaf/hovertreebatch.htm">批量</a></li>    
  28. <li><a href="http://hovertree.com/texiao/easysector/">饼图</a></li>    
  29. <li><a href="http://tool.hovertree.com/">工具</a></li>    
  30. </ul>    
  31. </nav>    
  32. <a href="#" class="cd-close" target="_self">关闭菜单</a>    
  33. </div>    
  34. </div>    
  35. <script src="http://hovertree.com/ziyuan/jquery/jquery-...min.js"></script>    
  36. <script src="http://hovertree.com/texiao/html//main.js"></script> <!-- Resource jQuery -->    
  37. </body>    
  38. </html>  

以上代码是小编给大家分享的HTML5手机端弹出遮罩菜单特效代码，希望对大家有所帮助。

HTML5手机端弹出遮罩菜单特效代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

HTML / CSS 相关文章推荐
可以随进度显示不同颜色的css3进度条分享
Apr 11 HTML / CSS
CSS3不透明度实例讲解
Apr 26 HTML / CSS
html5拍照功能实现代码(htm5上传文件)
Dec 11 HTML / CSS
html5 datalist标签使用示例(自动完成组件)
May 04 HTML / CSS
Html5新特性用canvas标签画多条直线附效果截图
Jun 30 HTML / CSS
利用HTML5中的Canvas绘制一张笑脸的教程
May 07 HTML / CSS
利用HTML5实现使用按钮控制背景音乐开关
Sep 21 HTML / CSS
一波HTML5 Canvas基础绘图实例代码集合
Feb 28 HTML / CSS
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
Mar 22 HTML / CSS
深入剖析HTML5 内联框架iFrame
May 04 HTML / CSS
HTML5 常见面试题之PC端和移动端区别介绍
Jan 22 HTML / CSS
CSS3 制作精美的定价表
Apr 06 HTML / CSS
HTML5实现简单图片上传所遇到的问题及解决办法
Jan 20 #HTML / CSS
Html5实现二维码扫描并解析
Jan 20 #HTML / CSS
图片上传插件ImgUploadJS：用HTML5 File API 实现截图粘贴上传、拖拽上传
Jan 20 #HTML / CSS
HTML5 History API 实现无刷新跳转
Jan 11 #HTML / CSS
基于HTML5新特性Mutation Observer实现编辑器的撤销和回退操作
Jan 11 #HTML / CSS
Html5插件教程之添加浏览器放大镜效果的商品橱窗
Jan 07 #HTML / CSS
移动端html5 meta标签的神奇功效
Jan 06 #HTML / CSS
re模块(2) 分词器(1) cvzone(1) mediapipe(1) while(1) 计算机视觉(2) 无限迭代(1) for(1) 事件调度器(1) okenizer(1)
You might like
php中static和const关键字用法分析
2016/12/07 PHP
Ecshop 后台添加新功能栏目及管理权限设置教程
2017/11/21 PHP
Thinkphp5行为使用方法汇总
2017/12/21 PHP
PHP Cli 模式设置进程名称的方法
2019/06/12 PHP
通过JAVASCRIPT读取ASP设定的COOKIE
2007/02/15 Javascript
Javascript 解疑
2009/11/11 Javascript
网页中的图片的处理方法与代码
2009/11/26 Javascript
onsubmit阻止form表单提交与onclick的相关操作
2010/09/03 Javascript
js定时调用方法成功后并停止调用示例
2014/04/08 Javascript
ExtJS4给Combobox设置列表中的默认值示例
2014/05/02 Javascript
JavaScript检测实例属性, 原型属性
2015/02/04 Javascript
纯javascript实现简单下拉刷新功能
2015/03/13 Javascript
基于jQuery实现弹幕APP
2017/02/10 Javascript
JS实现一个简单的日历
2017/02/22 Javascript
关于定制FileField中的上传文件名称问题
2017/08/22 Javascript
JavaScript中的一些隐式转换和总结(推荐)
2017/12/22 Javascript
浅谈node模块与npm包管理工具
2018/01/03 Javascript
基于Vue SEO的四种方案(小结)
2019/07/01 Javascript
使用flow来规范javascript的变量类型
2019/09/12 Javascript
[04:29]2016国际邀请赛中国区预选赛Ehome战队教练采访
2016/06/27 DOTA
[03:59]第二届DOTA2亚洲邀请赛选手传记-VGJ.rOtk
2017/04/03 DOTA
Python随机生成均匀分布在三角形内或者任意多边形内的点
2017/12/14 Python
python reverse反转部分数组的实例
2018/12/13 Python
Python3中函数参数传递方式实例详解
2019/05/05 Python
Python 实现顺序高斯消元法示例
2019/12/09 Python
CSS3 选择器 属性选择器介绍
2012/01/21 HTML / CSS
kmart凯马特官网：美国最大的打折零售商和全球最大的批发商之一
2016/11/17 全球购物
什么是Deployment descriptors；都有什么类型的部署描述符
2015/07/28 面试题
自荐信怎么写好
2013/11/11 职场文书
公司年会晚宴演讲稿
2014/01/06 职场文书
《维生素c的故事》教学反思
2014/02/18 职场文书
商务日语专业自荐信
2014/04/17 职场文书
2015年社会实践个人总结
2015/03/06 职场文书
针对吵架老公保证书
2015/05/08 职场文书
十八大观后感
2015/06/12 职场文书
Python写情书? 10行代码展示如何把情书写在她的照片里
2022/04/21 Python