码迷,mamicode.com
首页 > Web开发 > 详细

JS( 1 )练习

时间:2014-07-28 02:59:29      阅读:225      评论:0      收藏:0      [点我收藏+]

标签:style   java   color   os   strong   io   cti   html   

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>JS练习第一课</title>
 </head>
 <link id="bg" rel="stylesheet" type="text/css" href="">  /这里是给了引入的样式表一个ID,空值它引入的样式地址/
 <style type="text/css">
 div{
   color:#FFF;
   font-size:16px;
   font-family:microsoft yahei;
   font-weight:700;
   line-height:50px;
   text-align:center;
   border:1px solid blue;
   display:none;    //div默认为隐藏
 }
 </style>
 <script type="text/javascript">
   function bloc()  //鼠标悬停执行此函数,onmouseover
   {
     var aDiv=document.getElementById(‘div1‘);  /获取div1这个ID,并给他取个名字为aDiv/
var aBg=document.getElementById("bg");  /获取bg这个ID,并给他取个名字为aBg/
aDiv.style.display="block"  /让它的display显示/
aDiv.style.background="pink"  /让它的背景变为粉色/
aDiv.style.width="180px"  /让它的宽变为180像素/
aDiv.style.height="50px"  /让它的高变为50像素/
aBg.href="a.css"
   }
   function non()  //鼠标移除执行此函数,onmouseout
   {
     var aDiv=document.getElementById(‘div1‘);  /获取div1这个ID,并给他取个名字为aDiv/
var aBg=document.getElementById("bg");  /获取bg这个ID,并给他取个名字为aBg/
aDiv.style.display="none";  /让它的div隐藏/
aBg.href=""/让它href为空,不引入样式表/
   }

 </script>
 <body>
<label onmouseover="bloc();" onmouseout="non()"><input type="checkbox">保存密码</label>/鼠标放在此处可以出现效果/
  <div id="div1">不要在公共场合保存密码</div>  /此div默认为隐藏/
 </body>
</html>

JS( 1 )练习,布布扣,bubuko.com

JS( 1 )练习

标签:style   java   color   os   strong   io   cti   html   

原文地址:http://www.cnblogs.com/mrjie/p/3872106.html

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