Grå mouseover

<script language="javascript" type="text/javascript">
var tjek = false
function skift(hvem){
    if (tjek){
    hvem.src = "1.gif";
    tjek = false}
    else{
    hvem.src = "2.gif";
    tjek = true}
}
</script>


<img src="1.gif" border="0" width="12" height="12" alt="billede" name="nr1" onmouseover='skift(this)' onmouseout='skift(this)'>

<img src="1.gif" border="0" width="12" height="12" alt="billede" name="nr2" onmouseover='skift(this)' onmouseout='skift(this)'>

1.gif skal være sort/hvid. 2.gif skal have farver.

Hmm.. Hvad så med teksten? Jeg er kommet til at tænke på at jeg har dette i min head:

<style>
a:hover
{
  text-decoration: none;
  color: #003366;
  background-color: #006699;
}
</style>

så når jeg laver billedet + tekst, så kommer det jo farve!! =(
Er der nogen måde man kan fortælle den at dette link ikke skal være omfattet af stylen??

Du kan skrive

<style>
a:hover
{
  text-decoration: none;
  color: #003366;
  background-color: #006699;
}
.gryn
{
  text-decoration: none;
  color: #CCCCCC;
  background-color: #006699;
}

.gryn:hover
{
  text-decoration: none;
  color: red;
  background-color: #006699;
}

</style>


<a href="blabla.html" class="gryn">

Nu har jeg samlet stykkerne:


<style>
a:hover
{
  text-decoration: none;
  color: #003366;
  background-color: #006699;
}
.gryn
{
  text-decoration: none;
  color: #CCCCCC;
  background-color: #006699;
}

.gryn:hover
{
  text-decoration: none;
  color: red;
  background-color: #006699;
}

</style>

<script language="javascript" type="text/javascript">
var tjek = false
function skift(hvem){
    if (tjek){
    hvem.src = "1.gif";
    tjek = false}
    else{
    hvem.src = "2.gif";
    tjek = true}
}
</script>

<a href="blabla.html" class="gryn" onmouseover='skift(document.images.nr1)' onmouseout='skift(document.images.nr1)'>
<img src="1.gif" border="0" width="12" height="12" alt="billede" name="nr1"> Link nr1
</a><br>
<a href="blabla.html" class="gryn" onmouseover='skift(document.images.nr2)' onmouseout='skift(document.images.nr2)'>
<img src="1.gif" border="0" width="12" height="12" alt="billede" name="nr2"> Link nr2
</a>

k! Fedt!
Men.. Dette har jeg i head:

<script language="JavaScript1.2">

//Highlight image script- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}

</script>

og her mit link:

<A HREF="http://www.???.dk" TARGET="_blank" class="gryn"><IMG SRC="???.jpg" BORDER="0" WIDTH="100" HEIGHT="99" ALIGN="top" ALT="" STYLE="filter:alpha(opacity=20);-moz-opacity:0.2" onmouseover="makevisible(this,0)" onmouseout="makevisible(this,1)">Dette handler om ???!</A>

Men når jeg holder musen over teksten, "lyser" billedet ikke op!! WHY?

Du får 50 point for det her! ;)

Du skal ændre det nederste til:

<A HREF="http://www.???.dk" TARGET="_blank" class="gryn" onmouseover="makevisible(document.images.pic1,0)" onmouseout="makevisible(document.images.pic1,1)"><IMG SRC="???.jpg" BORDER="0" WIDTH="100" HEIGHT="99" ALIGN="top" ALT="" STYLE="filter:alpha(opacity=20);-moz-opacity:0.2" name="pic1">Dette handler om ???!</A>

TAKKER!!!!!!! YA THA MAAAAAN!!!!

takker for point!!!