Kako spremeniti CSS na mouseover/mouseout

6 naročnikov

Na eni strani imam <a href="index.php">, na drugi strani <div class="content">.

Rabil pa bi, da se na mouseover čez <a> link tale <div class="content"> skrije in potem na mouseout pa spet pojavi.

Na kakšen način bi bilo to najeleganteje doseči?
Iskal sem kakšno jQuery rešitev vendar je že pozna ura, možgani so že utrujeni, oči prav tako, skratka nič našel...

Kakšne sugestije?

<a> moraš dati class ali ID po katerem ga boš "naslovil" in ločil od drugih

$("a.akcija").mouseenter(function() {
    $("div.content").hide();
  }).mouseleave(function() {
        $("div.content").show();
  });

Hvala, to je to.

Priporočam ti, da delaš v tem primeru z IDji, ker naj bi bili unikatni v smislu, da pripadajo točno določenemu elementu strani, medtem ko classe lahko dodeliš večim. Sicer pa, če imaš samo 1 class s tem imenom, bo tudi ok. Samo kot opomba.

Še mogoče en krajši način:

$("#id").hover(function(){
  $("div.content").hide();
},function(){
  $("div.content").show();
});

Pa mogoče še namesto show in hide kak fadeIn in fadeOut :)

Kaj pa koda za mouseover v HTML?

@bobo05:

#imediva
{
width:100px;
height:150px;
background-color:#fff;
}

#imediva:hover
{
background-color:#000;
}

samo pri hoover moraš pazit če imaš znotraj objekta še kakšen objekt, ker takrat se hoover izklopi ko zapelješ na "otok" ;)