css span

[edi]

Hi

hab folgendes problem:
ich will das, wenn man über nen link fährt
sich ein anderer text färbt (net der link selber)
Es funktioniert wenn der span im <a> tag drinnen is
aber geht des net irgendwie anders ?
weil der text sollte am ende an ner ganz anderen stelle stehen.

thx a lot
cheers
edi

<style type="text/css">
<!--
div#link {color:#000000}
div#link a {color:#000000}
div#link a:hover {color:#000000}
div#link a span {color:#CCCCCC}
div#link a:hover span {color:#FC7F00}
-->
</style>

<div id="link"> 
<pre>
<a href="#">Link</a>
<span>
      ___          
     /  /\           
    /  /::\       
   /  /:/\:\     
  /  /::\ \:\   
 /__/:/\:\_\:\ 
 \__\/~|::\/:/ 
    |  |:|::/  
    |  |:|\/     
    |__|:|~    
     \__\|    
</span>
</pre>

 

[Tim C.]

Meiner Meinung nach ist das adequat nur mit Javascript zu lösen.

 

[edi]

jo
nur des prob ist dass ich kein peil von java hab

 

[Andreas Gaisbauer]

In Javascript wärs so:

<pre>
<a href="#" onMouseOver="document.getElementById('test').style.color = 'red';"
onMouseOut="document.getElementById('test').style.color = 'black';">Link</a>
<span id="test">
      ___          
     /  /\           
    /  /::\       
   /  /:/\:\     
  /  /::\ \:\   
 /__/:/\:\_\:\ 
 \__\/~|::\/:/ 
    |  |:|::/  
    |  |:|\/     
    |__|:|~    
     \__\|    
</span>
</pre>

Wenn du das öfters brauchst, ist es sinnvoller das ganze in eine Funktion zu packen...


ciao

 

[Daniel Toplak]

@edi

Wie im Chat besprochen:

<pre>
<a href="#" onMouseOver="document.getElementById('test').style.color = 'red';"
onMouseOut="document.getElementById('test').style.color = 'gray';">Link</a>
<font color='gray'>
<span id="test">
      ___          
     /  /\           
    /  /::\       
   /  /:/\:\     
  /  /::\ \:\   
 /__/:/\:\_\:\ 
 \__\/~|::\/:/ 
    |  |:|::/  
    |  |:|\/     
    |__|:|~    
     \__\|    
</span>
</font>
</pre>

Ich denke das wolltest du oder
Gruss Homer

 

[nytemare]

Original geschrieben von crono
@edi

Wie im Chat besprochen:

<pre>
<a href="#" onMouseOver="document.getElementById('test').style.color = 'red';"
onMouseOut="document.getElementById('test').style.color = 'gray';">Link</a>
<font color='gray'>
<span id="test">
      ___          
     /  /\           
    /  /::\       
   /  /:/\:\     
  /  /::\ \:\   
 /__/:/\:\_\:\ 
 \__\/~|::\/:/ 
    |  |:|::/  
    |  |:|\/     
    |__|:|~    
     \__\|    
</span>
</font>
</pre>

wenn wir hier schon im css forum sind, kann man auch ruhig das veraltete font tag weglassen und die stilangabe in css verpacken:

<pre>
<a href="#" onMouseOver="document.getElementById('test').style.color = 'red';"
onMouseOut="document.getElementById('test').style.color = 'gray';">Link</a>
<span id="test" style="color: gray;">
      ___          
     /  /\           
    /  /::\       
   /  /:/\:\     
  /  /::\ \:\   
 /__/:/\:\_\:\ 
 \__\/~|::\/:/ 
    |  |:|::/  
    |  |:|\/     
    |__|:|~    
     \__\|    
</span>
</pre>

 

[Daniel Toplak]

wenn wir hier schon im css forum sind, kann man auch ruhig das veraltete font tag weglassen und die stilangabe in css verpacken:

Sorry, aber ich bin weder Webentwickler noch -designer.
Also hab ich es hald so gemacht wie ich es weiß und von css hab ich einfach zu wenig Ahnung.

Gruss Homer