码迷,mamicode.com
首页 > 其他好文 > 详细

点击按钮出现弹窗

时间:2018-03-28 20:29:23      阅读:353      评论:0      收藏:0      [点我收藏+]

标签:出现   action   xmlns   san   按钮   窗口   text   xhtml 1.0   generated   


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery点击弹出登陆窗口</title>
<link rel="stylesheet" type="text/css" href="http://sandbox.runjs.cn/uploads/rs/55/sjckzedf/lanrenzhijia.css">
<script type="text/javascript" src="http://sandbox.runjs.cn/uploads/rs/55/sjckzedf/jquery-1.8.0.min.js"></script>
<script>
jQuery(document).ready(function($) {
$(‘.theme-login‘).click(function(){
$(‘.theme-popover-mask‘).fadeIn(100);
$(‘.theme-popover‘).slideDown(200);
})
$(‘.theme-poptit .close‘).click(function(){
$(‘.theme-popover-mask‘).fadeOut(100);
$(‘.theme-popover‘).slideUp(200);
})

})
</script>

</head>

<body>
<div class="theme-buy">
<a class="btn btn-primary btn-large theme-login" href="javascript:;">点击查看效果</a>
</div>
<div class="theme-popover">
<div class="theme-poptit">
<a href="javascript:;" title="关闭" class="close">×</a>
<h3>登录 是一种态度</h3>
</div>
<div class="theme-popbod dform">
<form class="theme-signin" name="loginform" action="" method="post">
<ol>
<li><h4>你必须先登录!</h4></li>
<li><strong>用户名:</strong><input class="ipt" type="text" name="log" value="lanrenzhijia" size="20" /></li>
<li><strong>密码:</strong><input class="ipt" type="password" name="pwd" value="***" size="20" /></li>
<li><input class="btn btn-primary" type="submit" name="submit" value=" 登 录 " /></li>
</ol>
</form>
</div>
</div>
<div class="theme-popover-mask"></div>
</body>
</html>

<style></style>
<script></script>

<!-- Generated by RunJS (Wed Mar 28 15:20:30 CST 2018) 0ms -->

点击按钮出现弹窗

标签:出现   action   xmlns   san   按钮   窗口   text   xhtml 1.0   generated   

原文地址:https://www.cnblogs.com/arvins/p/8665532.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!