課程
/前端開(kāi)發(fā)
/JavaScript
/JavaScript進(jìn)階篇
請(qǐng)問(wèn)鼠標(biāo)經(jīng)過(guò)變顏色的代碼怎么寫啊
2019-03-27
源自:JavaScript進(jìn)階篇 6-3
正在回答
我目前只想到2種方法:
1、通過(guò)設(shè)置元素對(duì)象的className改變樣式,但這樣比較麻煩;
2、通過(guò)設(shè)置元素對(duì)象的style屬性值改變樣式。
關(guān)鍵代碼如下:
(1)CSS代碼:(根據(jù)自己喜好)
.one{
color:green;
font-size:20px;
width:100px;
background-color:pink;
font-style:italic;
font-weight:bold;
text-decoration:line-through;
}
(2)JS代碼:
function change(){
//通過(guò)設(shè)置元素的className改變樣式
var obj=document.getElementById("demo");
obj.className="one";
function change2(){
//通過(guò)設(shè)置元素對(duì)象的style屬性改變樣式
var obj=document.getElementById("demo1");
obj.style.color="red";
之前教程不就是有嗎,先獲取對(duì)應(yīng)id,然后通過(guò) style修改樣式,最后在? 要經(jīng)過(guò)的地方? onmouseover? 事件
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 鼠標(biāo)經(jīng)過(guò)事件 </title>
<script type="text/javascript">
? ? function message(){
? ? ? var mycolor = document.getElementById("psw");
? mycolor.style.color = "red";
? ? ? }
</script>
</head>
<body>
<form>
<p id = "psw">密碼</P>:<input? name="password" type="password" >
<input name="確定" type="button" value="確定" onmouseover = "message()"/>
</form>
</body>
</html>
求具體代碼參考
慕姐3881878
onmouseover,用他解決
qq_慕用2129022 提問(wèn)者
舉報(bào)
本課程從如何插入JS代碼開(kāi)始,帶您進(jìn)入網(wǎng)頁(yè)動(dòng)態(tài)交互世界
3 回答鼠標(biāo)經(jīng)過(guò)改變背景顏色問(wèn)題
2 回答鼠標(biāo)經(jīng)過(guò)和移開(kāi)后顏色不變
3 回答新建行鼠標(biāo)經(jīng)過(guò)沒(méi)有顏色怎么回事?
1 回答 為什么鼠標(biāo)滑過(guò)顏色這么寫不對(duì)啊,劃過(guò)的時(shí)候整個(gè)表格都變色了
4 回答為什么我添加的行,不會(huì)隨鼠標(biāo)的經(jīng)過(guò)而改變顏色呢?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2019-11-11
我目前只想到2種方法:
1、通過(guò)設(shè)置元素對(duì)象的className改變樣式,但這樣比較麻煩;
2、通過(guò)設(shè)置元素對(duì)象的style屬性值改變樣式。
關(guān)鍵代碼如下:
(1)CSS代碼:(根據(jù)自己喜好)
.one{
color:green;
font-size:20px;
width:100px;
background-color:pink;
font-style:italic;
font-weight:bold;
text-decoration:line-through;
}
(2)JS代碼:
function change(){
//通過(guò)設(shè)置元素的className改變樣式
var obj=document.getElementById("demo");
obj.className="one";
}
function change2(){
//通過(guò)設(shè)置元素對(duì)象的style屬性改變樣式
var obj=document.getElementById("demo1");
obj.style.color="red";
}
2019-05-06
之前教程不就是有嗎,先獲取對(duì)應(yīng)id,然后通過(guò) style修改樣式,最后在? 要經(jīng)過(guò)的地方? onmouseover? 事件
2019-05-06
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 鼠標(biāo)經(jīng)過(guò)事件 </title>
<script type="text/javascript">
? ? function message(){
? ? ? var mycolor = document.getElementById("psw");
? mycolor.style.color = "red";
? ? ? }
</script>
</head>
<body>
<form>
<p id = "psw">密碼</P>:<input? name="password" type="password" >
<input name="確定" type="button" value="確定" onmouseover = "message()"/>
</form>
</body>
</html>
2019-03-28
求具體代碼參考
2019-03-27
onmouseover,用他解決