課程
/前端開發(fā)
/JavaScript
/JavaScript進(jìn)階篇
請問鼠標(biāo)經(jīng)過變顏色的代碼怎么寫啊
2019-03-27
源自:JavaScript進(jìn)階篇 6-3
正在回答
我目前只想到2種方法:
1、通過設(shè)置元素對象的className改變樣式,但這樣比較麻煩;
2、通過設(shè)置元素對象的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(){
//通過設(shè)置元素的className改變樣式
var obj=document.getElementById("demo");
obj.className="one";
function change2(){
//通過設(shè)置元素對象的style屬性改變樣式
var obj=document.getElementById("demo1");
obj.style.color="red";
之前教程不就是有嗎,先獲取對應(yīng)id,然后通過 style修改樣式,最后在? 要經(jīng)過的地方? onmouseover? 事件
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 鼠標(biāo)經(jīng)過事件 </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 提問者
舉報
本課程從如何插入JS代碼開始,帶您進(jìn)入網(wǎng)頁動態(tài)交互世界
3 回答鼠標(biāo)經(jīng)過改變背景顏色問題
2 回答鼠標(biāo)經(jīng)過和移開后顏色不變
3 回答新建行鼠標(biāo)經(jīng)過沒有顏色怎么回事?
1 回答 為什么鼠標(biāo)滑過顏色這么寫不對啊,劃過的時候整個表格都變色了
4 回答為什么我添加的行,不會隨鼠標(biāo)的經(jīng)過而改變顏色呢?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2019-11-11
我目前只想到2種方法:
1、通過設(shè)置元素對象的className改變樣式,但這樣比較麻煩;
2、通過設(shè)置元素對象的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(){
//通過設(shè)置元素的className改變樣式
var obj=document.getElementById("demo");
obj.className="one";
}
function change2(){
//通過設(shè)置元素對象的style屬性改變樣式
var obj=document.getElementById("demo1");
obj.style.color="red";
}
2019-05-06
之前教程不就是有嗎,先獲取對應(yīng)id,然后通過 style修改樣式,最后在? 要經(jīng)過的地方? onmouseover? 事件
2019-05-06
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 鼠標(biāo)經(jīng)過事件 </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,用他解決