html5 css3模态窗口用户注册表单代码



93 371 124



特效描述:html5 css3模态窗口 用户注册表单代码,html5 模态窗口代码,注册表单代码

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/style.css">

2. 引入JS

<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>

3. HTML代码

<div class="open">打开窗口</div>
<div class="modal">
	<div class="form">
		<form>
			<label for="name" required="required">昵 称</label>
			<input id="name" type="text"/>
			<label for="email" required="required">电子邮件</label>
			<input id="email" type="email"/>
			<label for="pass">密 码</label>
			<input id="pass" type="password" required="required"/>
			<button type="button">注 册</button>
		</form>
	</div>
	<div class="invite">
		<h3>注册现在为我们的屡获殊荣的服务,并获得14天的免费试用。</h3>
		<div class="nope">不,谢谢,我不喜欢存钱 </div>
		<div title="close" class="close"></div>
	</div>
</div>
<script type="text/javascript">
$(".close, .nope").on('click', function () {
  $('.modal').addClass('hidden');
  $('.open').addClass('active');
})
$(".open").on('click', function () {
  $(this).removeClass('active');
  $('.modal').removeClass('hidden');
})
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滑动 滑块 滑动门 触屏滑动 滑动插件 滑块插件 浮动 悬浮 悬浮层 悬浮框 浮动层 浮动框 浮动插件 悬浮插件 浮动提示框 切换按钮 表单 表单美化 表单插件 表单美化插件 浮动菜单 浮动导航 图片滑动 图片滑块 文本框 text文本框 注册框 按钮控制 表单提交

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到