Tijden veranderen
[JS] Meerdere titels werken niet
Ik ben bezig met het nieuwe ontwerp van mijn site, en nu heb ik daar een aantal titels. Ik heb hier een leuk Javascript effect bijgevoegt, waarbij de titel leuk binnenkomt. Alleen werkt dit wel op 1 titel, wil ik meerder gaan doen, dan werkt het niet meer. Deze Javascript heb ik gebruikt:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<script type="text/Javscript">
var message="Titel 1"
var neonbasecolor="#C8F7F6"
var neontextcolor="black"
var flashspeed=100 //in milliseconds
///No need to edit below this line/////
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
//eval("document.all.neonlight"+m).style.color=neonbasecolor
crossref(m).style.color=neonbasecolor
}
//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script>
var message="Titel 1"
var neonbasecolor="#C8F7F6"
var neontextcolor="black"
var flashspeed=100 //in milliseconds
///No need to edit below this line/////
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
//eval("document.all.neonlight"+m).style.color=neonbasecolor
crossref(m).style.color=neonbasecolor
}
//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script>
Weten jullie nu ook een manier zodat ik deze meerdere keren kan gebruiken, maar dan met andere tekst?
Alvast heel hartelijk bedankt!
Willem-Jan
Jan Koehoorn schreef op 01.02.2007 20:23:
Je zou een array met titels aan moeten maken en die met een for loopje doorlopen en voor elke titel je animatiescript uitvoeren.
Zou je me dan ook kunnen uitleggen hoe ik dat kan doen, of een voorbeeld geven?