返回js控制DIV...登陆

js控制DIV

李木子2019-06-26 21:56:1390

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>js控制DIV</title>

<style type="text/css">

#box{

height:100px;

width:100px;

background:red;

margin-top:20px;

margin-left:100px;

}

#pass{

margin-left:20px;

}

[value]{

margin-top:10px;

margin-left:5px;

}

</style>

</head>

<body>

<script type="text/javascript">

var mydiv;

window.onload=function(){

mydiv=document.getElementById('box');}

function bg(){

mydiv.style.height="200px";}

function bk(){

mydiv.style.width="200px";}

function bs(){

mydiv.style.background="pink";}

function by(){

mydiv.style.borderRadius="100px";}

function yc(){

mydiv.style.display="none";}

function xs(){

mydiv.style.display="block";}

</script>

<div id="box"></div>

<div id="pass">

<input type="button" value="变高"  onclick="bg()"/>

<input type="button" value="变宽"  onclick="bk()"/>

<input type="button" value="变色"  onclick="bs()"/>

<input type="button" value="变圆"  onclick="by()"/>

<input type="button" value="隐藏"  onclick="yc()"/>

<input type="button" value="显示"  onclick="xs()"/>

</div>

</body>

</html>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送
  • PHP中文网