all-alert 本是古典 何须时尚 2022-06-11 09:06 114阅读 0赞 作者:[LoveEmperor\_王子様][LoveEmperor] <!DOCTYPE HTML> <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="zh"> <![endif]--> <!--[if IE 7]> <html class="no-js ie7 oldie" lang="zh"> <![endif]--> <!--[if IE 8]> <html class="no-js ie8 oldie" lang="zh"> <![endif]--> <!--[if gt IE 8]><!--> <html class="no-js" lang="zh"> <!--<![endif]--> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>12种利用html5+css3打造的消息提示框效果演示_jQuery之家-自由分享jQuery、html5、css3的插件库</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="shortcut icon" href="http://www.htmleaf.com/favicon.ico"> <link rel="apple-touch-icon" href="http://www.htmleaf.com/templets/default/images/ico/apple-touch-icon.png"> <link rel="apple-touch-icon" sizes="72x72" href="http://www.htmleaf.com/templets/default/images/ico/apple-touch-icon-72.png"> <link rel="apple-touch-icon" sizes="114x114" href="http://www.htmleaf.com/templets/default/images/ico/apple-touch-icon-114.png"> <link rel="apple-touch-icon" sizes="144x144" href="http://www.htmleaf.com/templets/default/images/ico/apple-touch-icon-144.png"> <link rel="stylesheet" type="text/css" href="http://www.htmleaf.com/templets/default/css/htmleaf-demo.min.css" /> <!--百度统计--> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?75c54d9855c6511931ab85e4b3a5de72"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <!--[if lt IE 9]> <script src="http://www.htmleaf.com/assets/js/html5shiv.min.js"></script> <script src="http://www.htmleaf.com/assets/js/respond.min.js"></script> <![endif]--> </head> <body> <div class="htmleaf-container"> <div class="htmleaf-container--header"> <div class="logo"> <a href="http://www.htmleaf.com/"><img src="http://www.htmleaf.com/templets/default/images/logo.svg" alt="jQuery之家"></a> </div> <h1>12种利用html5+css3打造的消息提示框效果演示</h1> <div class="responsive"> <a href="#" class="desktop active" title="在桌面浏览器中预览"></a> <a href="#" class="tabletlandscape" title="平板Landscape模式 (1024x768)"></a> <a href="#" class="tabletportrait" title="平板Portrait模式 (768x1024)"></a> <a href="#" class="mobilelandscape" title="移动手机Landscape模式 (480x320)"></a> <a href="#" class="mobileportrait" title="移动手机Portrait模式 (320x480)"></a> </div> <div class="actions"> <div class="action"> <a href="" class="button button--empty" title="返回下载页"><i class="fa fa-leaf"></i></a> </div> </div> </div> <div class="htmleaf--main"> <div class="htmleaf-container--side"> <!--广告位--> <div class="htmleaf-adv"> <h2 class="title">广告</h2> <div> <script type="text/javascript"> /*200*200*/ var cpro_id = "u2034900"; </script> <script src="http://cpro.baidustatic.com/cpro/ui/c.js" type="text/javascript"></script> </div> </div> <!--相关插件--> <div class="htmleaf-related"> <h2>相关插件</h2> </div> </div> <div class="htmleaf-container--content"> <iframe src="http://demo.htmleaf.com/1410/201410161705/index.html" id="iframe" ></iframe> </div> </div> </div> <script src="http://www.htmleaf.com/templets/default/js/htmleaf-demo.min.js"></script> <script type="text/javascript"> IS_IPAD=navigator.userAgent.match(/iPad/i)!=null; var t={ desktop:"100%",tabletlandscape:1040,tabletportrait:788,mobilelandscape:480,mobileportrait:340,placebo:0}; jQuery(".responsive a").on("click",function(){ var e=jQuery(this); for(device in t){ if(e.hasClass(device)){ clicked=device; jQuery("#iframe").width(t[device]); if(clicked==device){ jQuery(".responsive a").removeClass("active"); e.addClass("active")}}} return false}); if(IS_IPAD){ $("#iframe").css("padding-bottom","60px") } </script> <script type="text/javascript"> $(".htmleaf-container--side").mCustomScrollbar({ theme:"minimal" }); </script> </body> </html> [LoveEmperor]: http://my.csdn.net/
还没有评论,来说两句吧...