/ Forside/ Teknologi / Udvikling / Java Scripts / Spørgsmål
Login
Glemt dit kodeord?
Brugernavn 

Kodeord  


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Søger mouse over effekt til tekst!
Fra : er_du_klog
Vist : 389 gange
50 point
Dato : 21-08-04 19:57

Hej!!

Jeg søger en mouse over effekt til min hjemmeside.

Så hver gang jeg tager musen hen over teksten bliver den en anden farve!



 
 
Accepteret svar
Fra : BjarneD

Modtaget 60 point
Dato : 21-08-04 20:23

Det her er et mega godt sted at finde den slags http://dynamicdrive.com/

Kommentar
Fra : BjarneD


Dato : 21-08-04 20:25

Du kan søge på mouse over i toppen af siden. Mange spændende muligheder.

Kommentar
Fra : dreamvision


Dato : 21-08-04 20:41

Sæt mellem <head> </head> et stylesheet som dette, samt under <body>. Dette for at regulere selve teksten som du ønsker skal skifte farve, der kan så vælges understregning, uden understregning , samt tekststørrelser og font osv

<style>
<!--
.clsJustify {
   text-align : justify;
}
   
a   {
   text-decoration : none;
   color: #000000;
   }
p {
   text-decoration:none;
   font-family: Arial;
   color: #000000;
   font-size: 9px;
   font-weight: normal;
   }
h2 {
   text-decoration:none;
   font-family: Arial;
   color: #000000;
   font-size: 9px;
   font-weight: bold;
   }   
h3 {
   text-decoration:none;
   font-family: Arial;
   color: #000000;
   font-size: 9px;
   font-weight: bold;
   }
h4   {
   text-decoration:none;
   font-family: Arial;
   color: #000000;
   font-size: 9px;
   font-weight: normal;
   }
a:hover {
   text-decoration:underline;
   font-family: Arial Bold;
   color: #000000;
   font-size: 9px;
   font-weight: normal;
   }
.dropdown {
   width: 200;
   }
   
-->
</style>
</head>

<body background="../images/back.jpg" bgcolor="#FFFFFF" marginheight="0" topmargin="0" marginwidth="0" leftmargin="0" text="#FFFFFF" link="#C0C0C0" vlink="#C0C0C0" alink="#800000" bgproperties="fixed">

<script><!--
ua=navigator.userAgent;
v=navigator.appVersion.substring(0,1);
if ((ua.lastIndexOf("MSIE")!=-1) && (v!='1') && (v!='2') && (v!='3')) {
document.body.onmouseover=makeRed;
document.body.onmouseout=makeBlue;
}

function makeRed() {
src = event.toElement;
if (src.tagName == "A") {
src.oldcol = src.style.color;
src.style.color = "FF0000";
}
}

function makeBlue() {
src=event.fromElement;
if (src.tagName == "A") {
src.style.color = src.oldcol;
}
}
//-->
</script>

Stylesheetet herover under <body> behøver du ikke konfigurere yderligere, da det er "default" og tager over hvis det andet ikke virker.

Når du kommer ned til den aktive linie, hvor du ønsker mouseover-effekten, bruger du denne linie, men husk at <a href0""> og </a> skal omkranse selve fontlinien ellers er scriptet virkningsløst. Farven (this.style.color) kan sættes til næsten alt(yellow, darkgreen, darkred, purple osv - prøv dig frem)

<a href="#"><font color="#000000" size="-1" face="Arial" class="topnav" onMouseOver="this.style.color = 'red'" onMouseOut="this.style.color=''">om......</font></a>

Der findes andre, men dette er meget virkningsfuldt og enkelt.
God fornøjelse!

Kommentar
Fra : dreamvision


Dato : 21-08-04 20:44

Jeg ved ikke hvorfor linket forsvandt, men her er det igen:

<a href="#"><font color="#000000" size="2" face="Arial" class="topnav" onMouseOver="this.style.color = 'red'" onMouseOut="this.style.color=''">så......</font></a>

Kommentar
Fra : dreamvision


Dato : 21-08-04 20:45

Det gør det hver gang. Mærkeligt - hvis du har en e-mail, skal jeg tilsende dig det den vej

Kommentar
Fra : BjarneD


Dato : 21-08-04 20:51

Det er en lille ting der sker.
Hvis du vil vise koder så prøv med denne uden mellemrum
[ c o d e ]

kodetekst

[ / c o d e ]

Kommentar
Fra : BjarneD


Dato : 21-08-04 20:52

Det ser sådan ud

Kode
sådan


Kommentar
Fra : dreamvision


Dato : 22-08-04 09:54

Så prøver jeg: Her er linket endnu endnu engang:

<code>
<a href="#"><font color="#000000" size="2" face="Arial" class="topnav" onMouseOver="this.style.color = 'red'" onMouseOut="this.style.color=''">så......</font></a>
</code>

Kommentar
Fra : dreamvision


Dato : 22-08-04 09:56

Kode
<a href="#"><font color="#000000" size="2" face="Arial" class="topnav" onMouseOver="this.style.color = 'red'" onMouseOut="this.style.color=''">så......</font></a>


Kommentar
Fra : dreamvision


Dato : 22-08-04 09:59

Det lykkedes med [code] istedet for <code> - men stadig forsvinder det

Så jeg gør sådan her istedet:

a href="#" font color="#000000" size="2" face="Arial" class="topnav" onMouseOver="this.style.color = 'red'" onMouseOut="this.style.color=''" så...... /font /a

hvor jeg har fjernet alle < disse!!!

Kommentar
Fra : severino


Dato : 22-08-04 18:49

er_du_klog --- Ja det er jeg, og jeg er også snedig.

Hvis du ellers abonnere på flere af disse grupper her på Kandu, så bør du gemme de gode og spændende links i dine fortrukne, i en mappe som du evt. kan kalde for "hjemmesidetips"

Så har du altid hurtig adgang til nye ideer, når hjemmeside snedkeren går i aktion!

Kommentar
Fra : molokyle


Dato : 25-08-04 12:51

Jeg har ikke kunne finde et script på nettet, så jeg har lavet en lille ting til dig

Kode
<html>
<head>
<title>Change link color on mouseover</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function change()
{
var col=Math.round(Math.random()*16777215);
return col;
}
</script>
</head>
<body>
<a href="http://dmi.dk"><span onmouseout="this.style.color='red';" onmouseover="this.style.color=change();">DMI</span></a>
</body>
</html>


Du kan enten vælge at lade farven af et link falde tilbage til en default værdi som ovenfor (rød) eller blot kalde change() i onmouseout

</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 25-08-04 12:54

Ps. i eksemplet ovenfor er effekten brugt på et tekstlink, men du kan også bruge <span> elementet omkring alm. brødtekst.

<span onmouseout=".........>

Bla bla bla...

</span>

</MOLOKYLE>

Godkendelse af svar
Fra : er_du_klog


Dato : 14-09-04 19:27

Tak for svaret BjarneD.
                        

Du har følgende muligheder
Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.
Søg
Reklame
Statistik
Spørgsmål : 173633
Tips : 31664
Nyheder : 719565
Indlæg : 6383591
Brugere : 218258

Månedens bedste
Årets bedste
Sidste års bedste