Bir CSS :JavaScript ile hover efekti devre dışı bırakabilir miyim?

SORU

2 Mayıs 2010, Pazar

Bir CSS :JavaScript ile hover efekti devre dışı bırakabilir miyim?

JavaScript ile CSS :hover efekt kullanarak tarayıcı önlemek için çalışıyorum.

Eğer JS mevcut değil olsaydı zaten hover efekti istiyorum çünkü benim CSS a a:hover stilleri ayarlayın. Ama eğer JSmevcut, daha pürüzsüz bir (örneğin bir WordPress kullanmak renk eklentisi kullanarak.) CSS ile hover benim etkisi üzerine yazmak istiyorum

Bunu denedim:

$("ul#mainFilter a").hover(
     function(e){ e.preventDefault(); ...do my stuff... }, 
     function(e){ e.preventDefault(); ...do my stuff... });

Ben de return false;, ama çalışmıyor ile denedim.

Burada benim sorunum bir örnektir: http://jsfiddle.net/4rEzz/. Bağlantıyı sadece gri almadan sona erecektir.

Olarak bahsedilen şeklinde kesilmiş pasta, geçici bir çözüm olurdu reset hover stilleri kullanma .css() ama yapmak zorunda kalacağımı üzerine her özellik, belirtilen CSS (bkz: burada: http://jsfiddle.net/raPeX/1/ ). Genel bir çözüm arıyorum.

Herkes bunu nasıl biliyor mu?

PS: hover için hazırladım her stil üzerine yazmak istemiyorum.

CEVAP

4 Mayıs 2010, Salı

Saf JavaScript genel bir çözüm yok maalesef. JavaScript :hover kendisi devlet CSS kapatmak mümkün değil.

Aşağıdaki alternatif çözüm olsa da deneyebilirsin. Eğer HTML geçiyorum zihin ve biraz CSS, yok eğer doğru değilse, her CSS özelliği el ile JavaScript üzerinden sıfırlamak için vakit kazandırır.

HTML

<body class="nojQuery">

CSS

/* Limit the hover styles in your CSS so that they only apply when the nojQuery 
class is present */

body.nojQuery ul#mainFilter a:hover {
    /* CSS-only hover styles go here */
}

JavaScript

// When jQuery kicks in, remove the nojQuery class from the <body> element, thus
// making the CSS hover styles disappear.

$(function(){}
    $('body').removeClass('nojQuery');
)

Bunu Paylaş: