Avatar billede xhtml Nybegynder
05. februar 2006 - 22:08 Der er 11 kommentarer og
1 løsning

onmouseout og onmouseover ?

Hej Eksperter. :-)

Jeg har en kode, i en table, der gør at baggrunds-farven skrifter når musen kommer over.

Den ser sådan ud:

<td width="100%" onmouseout="this.style.backgroundColor='#FFFFFF';" onmouseover="this.style.backgroundColor='#E1E1E1';" style="border-bottom: 1px solid #C6C6C6">Hej med dig</td>

Kan man ikke lave en genvej til den ?

Ligesom man kan lave en genvej fra et stylesheet, ved at skrive class="navn"... Kan man så ikke skrive det ned det, og hvordan ?
Avatar billede amews_aj Nybegynder
05. februar 2006 - 22:43 #1
Det vil jeg ikke mene du kan, og dette bekræfter vist mit svar:

http://www.eksperten.dk/spm/615775

Det kunne ellers til tider være rart.. :)
Avatar billede amews_aj Nybegynder
05. februar 2006 - 22:55 #2
du kan selvfølgelig som også beskrives i det spørgsmål lave en javascript function, men det er stadigvæk ikke det samme...

<script type="text/javascript">
  function tdfarve(celle, farve) {
      celle.style.backgroundColor = farve;
  }
</script>

<table>
  <tr>
    <td onmouseover="tdfarve(this, '#000000');" onmouseout="tdfarve(this, '#FFFFFF');">asdasd</td>
  </tr>
</table>


Hvis det nu er en samme farve ved alle tabeller kan du skrive


<script type="text/javascript">
  function tdfarve(celle, act) {
      if ( act == "over" ) {
        celle.style.backgroundColor = '#000000';
      } else {
        celle.style.backgroundColor = '#FFFFFF';
      }
  }
</script>

<table>
  <tr>
    <td onmouseover="tdfarve(this, 'over');" onmouseout="tdfarve(this, 'out');">asdasd</td>
  </tr>
</table>


Det er vist det tætteste vi kommer på....
Avatar billede amews_aj Nybegynder
05. februar 2006 - 22:56 #3
Lige en rettelse til det sidste eksempel hvis det skal være helt korrekt

<script type="text/javascript">
  function tdfarve(celle, act) {
      if ( act == "over" ) {
        celle.style.backgroundColor = '#000000';
      } else if ( act == "out" ) {
        celle.style.backgroundColor = '#FFFFFF';
      }
  }
</script>

<table>
  <tr>
    <td onmouseover="tdfarve(this, 'over');" onmouseout="tdfarve(this, 'out');">asdasd</td>
  </tr>
</table>
Avatar billede xhtml Nybegynder
05. februar 2006 - 22:57 #4
ok, tak :-)
Avatar billede amews_aj Nybegynder
05. februar 2006 - 22:59 #5
skal vi lige lukke?
Avatar billede amews_aj Nybegynder
05. februar 2006 - 22:59 #6
selv tak
Avatar billede olebole Juniormester
06. februar 2006 - 21:38 #7
<ole>

- og en anelse mere 'sexy'  :)

<script type="text/javascript">
  function tdfarve(celle, over) {
        celle.style.backgroundColor = over ? '#000000' : '#ffffff';
  }
</script>

<table>
  <tr>
    <td onmouseover="tdfarve(this, true);" onmouseout="tdfarve(this);">asdasd</td>
  </tr>
</table>

/mvh
</bole>
Avatar billede amews_aj Nybegynder
07. februar 2006 - 10:02 #8
Så lærte jeg også lige det ;)
Avatar billede olebole Juniormester
07. februar 2006 - 11:57 #9
- ja, altså ... det gør jo hverken mere eller mindre end dit ... og det er som sådan heller ikke bedre. Det fylder bare lidt mindre  :)
Det var stadig dig, der kom med det rigtige svar. Min kommentar var og bliver kun en kommentar  ;o)
Avatar billede roenving Novice
07. februar 2006 - 13:35 #10
-- og det nærmeste man kan komme den slags, som man f.eks. kan med links, bliver noget i denne henretning:

<script type="text/javascript">
window.onload = function(){
  var tds = document.getElementsByTagName("td");
  for(i=0;tds.length>i;i++){
    if(tds[i].className == "overTd"){
      tds[i].onmouseover = function(){tdfarve(this,true);}
      tds[i].onmouseout = function(){tdfarve(this);}
    }
  }
}
  function tdfarve(celle, over) {
        celle.style.backgroundColor = over ? '#000' : '#fff';
  }
</script>

-- så kan man jo også benytte klassen til at style elementet:

<style type="text/css">
.overTd{color:red;border:1px dotted brown;cursor:pointer;}
</style>

<table>
  <tr>
    <td class="overTd">asdasd</td>
  </tr>
  <tr>
    <td>asdasd</td>
  </tr>
  <tr>
    <td class="overTd">asdasd</td>
  </tr>
</table>
Avatar billede amews_aj Nybegynder
07. februar 2006 - 13:54 #11
Det ser smart ud roenving. Det kan jeg sikkert også selv bruge engang ;)
Avatar billede xhtml Nybegynder
10. februar 2006 - 20:18 #12
Tak :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester