<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5+CSS3内置功能按钮提示框 - 网页模板</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/style.css" media="screen" type="text/css" />
</head>
<body>
<div class="Message" id="js-timer">
<div class="Message-icon">
<i class="fa fa-bell-o"></i>
</div>
<div class="Message-body">
<p>This is a simple, but friendly, notification.</p>
<p class="u-italic">It will disappear within a few seconds.</p>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<div class="Message Message--orange">
<div class="Message-icon">
<i class="fa fa-exclamation"></i>
</div>
<div class="Message-body">
<p>This is a simple notification with a brighter color...</p>
<p>If you bring you mouse here you can close it manually.</p>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<div class="Message Message--green">
<div class="Message-icon">
<i class="fa fa-check"></i>
</div>
<div class="Message-body">
<p>This is a message telling you that everything is a-okay!</p>
<p>Good job, and good riddance.</p>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<div class="Message Message--red">
<div class="Message-icon">
<i class="fa fa-times"></i>
</div>
<div class="Message-body">
<p>This is a notification that something went wrong...</p>
<button class="Message-button" id="js-helpMe">Yikes, help me please!</button>
<button class="Message-button js-messageClose">Don't care.</button>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<div class="Message">
<div class="Message-icon">
<i class="fa fa-bell-o"></i>
</div>
<div class="Message-body">
<p>Do you know that you can assign status and relation to a company right in the visit list?</p>
<button class="Message-button" id="js-showMe">Show me how</button>
<button class="Message-button js-messageClose">Nah, not interested</button>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<div class="Message Message--orange">
<div class="Message-icon">
<i class="fa fa-exclamation"></i>
</div>
<div class="Message-body">
<p>You haven't authorized your LinkedIn account. Would you like some help with that?</p>
<p class="u-italic">With your account connected we can show you what connections you have at a company that visited your site!</p>
<button class="Message-button" id="js-authMe">Authorize!</button>
<button class="Message-button js-messageClose">I'll just keep using carrier pigeons</button>
</div>
<button class="Message-close js-messageClose"><i class="fa fa-times"></i></button>
</div>
<script src='http://codepen.io/assets/libs/fullpage/jquery.js'></script>
<script src="js/index.js"></script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>来源:<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
HTML5+CSS3内置功能按钮提示框.zip
共3个文件
js:1个
html:1个
css:1个
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 173 浏览量
2022-11-18
22:13:31
上传
评论
收藏 4KB ZIP 举报
温馨提示
HTML5+CSS3内置功能按钮提示框.zip
资源推荐
资源详情
资源评论
收起资源包目录
HTML5+CSS3内置功能按钮提示框.zip (3个子文件)
HTML5+CSS3内置功能按钮提示框
jiaoben2248
css
style.css 2KB
index.html 3KB
js
index.js 693B
共 3 条
- 1
资源评论
芝麻粒儿
- 粉丝: 5w+
- 资源: 2万+
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功