js学习一：简单的鼠标移动和移出效果案例

那丶

于 2015-08-05 09:00:21 发布

阅读量577

点赞数 1

分类专栏： JS漫长学习路

本文链接：https://blog.csdn.net/zy1030070058/article/details/47291361

版权

JS漫长学习路专栏收录该内容

4 篇文章 0 订阅

订阅专栏

案例说明：鼠标移动到一片区域，移出和移到会有简单的效果

html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>简单的鼠标移动和移出效果案例</title>

<style>

#div1{width:200px;height:200px;display:block;background:green;}

</style>
</head>
<body id="body">

<div id="div1">

区域一

<div>

<script type="text/javascript" src="index.js" ></script>
</body>
</html>

index.js

window.οnlοad=change;
function change(){
var oDiv=document.getElementById("div1");
oDiv.οnmοuseοver=function(){
oDiv.style.width=200px;
oDiv.style.height=300px;
oDiv.style.display="none";
oDiv.style.background="red";
}

<pre name="code" class="javascript">oDiv.οnmοuseοut=function(){
oDiv.style.width=200px;
oDiv.style.height=200px;
oDiv.style.display="block";
oDiv.style.background="green";
}

}

那丶

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js学习一：简单的鼠标移动和移出效果案例

案例说明：鼠标移动到一片区域，移出和移到会有简单的效果html代码简单的鼠标移动和移出效果案例#div1{width:200px;height:200px;display:block;background:green;}区域一index.jswindow.onload=change;function change(){var oDiv=docum
复制链接

扫一扫