html5 css3模態窗口用戶注冊表單代碼



100 398 133



特效描述: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

加群請備注:從官網了解到

湖北30选5开奖结果走势图表