在html5页面中,一个div或者图片,鼠标移动上去的时候变大,移出的时候又变回原样怎么弄,

求大神,求高手,要又代码... 求大神,求高手,要又代码 展开
 我来答
Alexs耶
2016-08-27 · TA获得超过1641个赞
知道小有建树答主
回答量:239
采纳率:93%
帮助的人:75.7万
展开全部

这里介绍两种方式:

一:通过css样式中的 ":hover"实现,代码如下

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
background:red;
width:200px;
height:200px;
}
div:hover{
background:red;
width:500px;
height:500px;
}
</style>
</head>
<body>
<div>变大</div>
</body>
</html>

二:通过javascript方式实现,代码如下

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
background:red;
width:200px;
height:200px;
}
.divs{
background:red;
width:500px;
height:500px;
}
</style>
</head>
<body>
<div>变大</div>
<script>
// 首先获取div元素
var divs = document.getElementsByTagName('div')[0];
//鼠标移入,将divs的className样式赋给该标签
divs.onmouseover = function () {
this.className = "divs";
}
//鼠标移出,将空的className样式赋给该标签
divs.onmouseout = function () {
this.className = "";
}
</script>
</body>
</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式