1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

JS点击让元素变大

这个例子,点一次按钮,图就变大一点

<!DOCTYPE html>      <html>      	<head>      		<meta charset="UTF-8">      		<title></title>      		<style type="text/css">      			#kk{      				/*width: 300px;*/      				height: 280px;      				background: #DDA0DD;      				margin: 100px auto;      			}      		</style>      		<script type="text/javascript">      			window.onload = function(){      //			为了方便,把能用到的先抓元素,先存到一个变量里! 变量的名字可以随便取,取跟id名字一样是为了好用      			var dd =document.getElementById('dd');      			var kk = document.getElementById('kk');      //			给按钮加单击事件      			dd.onclick = function(){      //				获得元素当前的宽度      				var kk_width =  kk.style.width;      //				alert(kk_width);      //				计算新的宽度值      //				var cc_width = kk_width+10;      //				parseInt将字符串转换成整数 kk_width:300px转换成300,px去掉      				var cc_width = parseInt(kk_width)+10;      //				将新的宽度值赋值回元素  加上单位,不能让它回去也是310吧      				kk.style.width = cc_width+'px';      			}	        			}      //		上面的这个也是写运动的基本步骤      		</script>      	</head>      	<body>      		<input type="button"  id="dd" value="点我呀" />      		<br /><br />      		<!--为了方便抓这个宽度,把宽度写在行内样式里。要不然kk_width抓不到-->      		<div id="kk" style="width: 300px;"></div>      	</body>      </html>

原文链接:https://www.qiquanji.com/post/7477.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: