欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 编程资源 > 编程问答 >内容正文

编程问答

鼠标移动过去变大变绿

发布时间:2025/4/14 编程问答 40 豆豆
生活随笔 收集整理的这篇文章主要介绍了 鼠标移动过去变大变绿 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

原始代码

 

<html><head><meta charset="utf-8"><meta name="generator"content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" /><title>鼠标移动过去放大变色</title><style>#div1 {width:200px;height:200px;background:red;}</style></head><body><div id="div1" onmouseover="document.getElementById('div1').style.height='300px';document.getElementById('div1').style.width='300px';document.getElementById('div1').style.background='green';"onmouseout="document.getElementById('div1').style.height='200px';document.getElementById('div1').style.width='200px';document.getElementById('div1').style.background='red';"></div></body> </html>

 

函数

<html><head><meta charset="utf-8"><meta name="generator"content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" /><title>鼠标移动过去放大变色</title><style>#div1 {width:200px;height:200px;background:red;}</style><script>function toGreen(){document.getElementById('div1').style.height='300px';document.getElementById('div1').style.width='300px';document.getElementById('div1').style.background='green';}function toRed(){document.getElementById('div1').style.height='200px';document.getElementById('div1').style.width='200px';document.getElementById('div1').style.background='red';}</script></head><body><div id="div1" onmouseover="toGreen()"onmouseout="toRed()"></div></body> </html>

 

变量名称

<html><head><meta charset="utf-8"><meta name="generator"content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" /><title>鼠标移动过去放大变色</title><style>#div1 {width:200px;height:200px;background:red;}</style><script>function toGreen(){var oDiv=document.getElementById('div1');oDiv.style.height='300px';oDiv.style.width='300px';oDiv.style.background='green';}function toRed(){var oDiv=document.getElementById('div1');oDiv.style.height='200px';oDiv.style.width='200px';oDiv.style.background='red';}</script></head><body><div id="div1" onmouseover="toGreen()"onmouseout="toRed()"></div></body> </html>

 

转载于:https://www.cnblogs.com/Yimi/p/5923111.html

总结

以上是生活随笔为你收集整理的鼠标移动过去变大变绿的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。