臨時的onmouseover

的CSS「懸停」選擇applys臨時風格的元素，它不是明確的：臨時的onmouseover

div:hover { 
background-color: red; 
}

我可以做的JavaScript同樣的事情，但它是幾個元素有點複雜，也不可能：

var elem = document.getElementsByTagName ("div")[0]; 

elem.onmouseover = function() { 
this.style.backgroundColor = "red"; 
} 

elem.onmouseout = function() { 
this.style.backgroundColor = "transparent"; 
}

有沒有更好的方法？事情是這樣的：

document.getElementsByTagName ("div")[0].ontemporarymouseover = function() { // LoL 
this.style.backgroundColor = "red"; 
}

感謝

來源

2010-05-16 Caio

在這種情況下，「不確定」是什麼意思？ – Quentin 2010-05-16 15:39:58

函數'getElementByTagName'不存在。只有'getElementsByTagName'。這肯定是你有問題的原因。 – 0x2D9A3 2010-05-16 15:45:41

除了我之前的評論，我的直覺告訴你正在嘗試使用JavaScript來解決級聯缺乏理解的問題：http://www.w3.org/TR/CSS21/cascade.html#specificity – Quentin 2010-05-16 15:54:12

// jQuery的 '臨時mouseevents'

$("element").bind 
({ 
    mouseover: 
     function() 
     { 
     }, 
    mouseout: 
     function() 
     { 
     } 
}); 

$("element").unbind('mouseover mouseout');

我希望這是你所需要的一個好方法。

來源

2010-05-16 16:06:20 BrunoLM

我不使用JQuery，但綁定是答案，謝謝:) – Caio 2010-05-16 16:18:18

在JavaScript這種行爲只能通過聽取mouseover和mouseoutDOM events，正如你在第二個例子中做處理。不過，建議使用CSS處理懸停樣式，如第一個示例中所示。

來源

2010-05-16 15:39:27

您可以使用用於設置（並取消設置）「懸停」類的Javascript，然後使用CSS應用樣式。 – Pointy 2010-05-16 15:50:06

@Pointy：真的......我的意思是「除此之外......」:) – 2010-05-16 16:01:45

我相信，如果你使用了jQuery JavaScript框架，你可以這樣做：

$('div:first').hover(function(){ 
    $(this).css('background-color','red'); 
},function(){ 
    $(this).css('background-color','white'); 
});

來源

2010-05-16 15:50:33

不，這將背景色設置爲「紅色」onmouseover和onmouseout。 – Quentin 2010-05-16 15:52:44

通過添加一個handlerOut對象糾正了代碼 – 2010-05-16 17:40:30

沒有，有沒有辦法申請風格，自己消失。

Eventhough的CSS只包含一個定義，它實際上相當於觸發onmouseover和onmouseout兩個狀態的變化。當指針進入元素時，:hover僞類被添加到它，使CSS規則適用。當指針離開元素時，將刪除:hover僞類，使CSS規則不再適用。

來源

2010-05-16 15:50:55 Guffa

臨時的onmouseover

回答

相關問題