您的位置:首页 > Web前端 > HTML

html 弹窗

2016-05-10 19:36 555 查看
<script src="http://code.jquery.com/jquery-latest.js"></script>

<style>
.popup
{
width:500px;
height:130px;
border:2px solid #B8B8B8;
position: fixed;
top:30%;
left:30%;
background-color:#E2E3E5;
display:none;
}

.closebtn
{
width: 40px;
height: 40px;
display: inline-block;
text-align:center;
cursor:default;
float:right;
}

.urlCconten
{
width:498px;
height:85px;
text-align:left;
position:relative;
top:5px;
z-index:99;
}

.uploadbtn
{
float:left;
width:80px;
text-align:center;
background-color:#E7F5FE;
cursor:pointer;
}
</style>

<div class="popup" id="popup">
<span class="close closebtn" id="closeUrl" onclick="closeUrl();">╳</span>
<textarea id="urlCconten" class="urlCconten" onclick="selectAll();"></textarea>
</div>

<button name="show" id="show" onclick="showPop();">show</button>

<script type="text/javascript">

//关闭弹窗
function closeUrl()
{
$('#popup').hide();
}

//显示视频源url
function showPop()
{
$('#urlCconten').html('这里是内容。。');
//弹框显示
$('#popup').show();
}

//全选textarea
function selectAll()
{
$('#urlCconten').select();
}

</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: