Ik heb een pagina met 2 layers, zodra de bezoeker op "Dit mag u van ons verwachten >>>" link klinkt laad layer 2 zich. De bedoeling is dat de tekst van onder naar boven in komt scrollen.
Allemaal leuk en aardig zou je denken totdat je het ook in firefox test, dan blijkt het niet meer te werken. Zoals je aan de alert kan zien is in firefox style.top: NaN (not a number), in ie wordt wel netjes "500" aangegeven. Het probleem moet dus in dat stukje zitten, helaas (na heel wat uurtjes proberen) krijg ik het niet werkend.
Hopende op hulp hier de code:
Je kunt de pagina hier werkend zien.
Allemaal leuk en aardig zou je denken totdat je het ook in firefox test, dan blijkt het niet meer te werken. Zoals je aan de alert kan zien is in firefox style.top: NaN (not a number), in ie wordt wel netjes "500" aangegeven. Het probleem moet dus in dat stukje zitten, helaas (na heel wat uurtjes proberen) krijg ik het niet werkend.
Hopende op hulp hier de code:
code:
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style type="text/css">
#marqueecontainer {
position: relative;
width: 370px;
height: 500px;
overflow: hidden;
}
#layer1 {
position: absolute;
width: 370px;
height: 500px;
}
#layer2 {
position: absolute;
width: 370px;
height: 500px;
visibility: hidden;
}
</style>
<script type="text/javascript">
function loadlayer ()
{
display ('1');
}
function showlayer1 ()
{
display ('1');
}
function showlayer2 ()
{
display ('2');
}
/***********************************************
* Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
var delayb4scroll=0; //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var marqueespeed=3; //Specify marquee scroll speed (larger is faster 1-10)
var marqueespeedstop=0;
var pauseit=0; //Pause marquee onMousever (0=no. 1=yes)?
var timerID=0;
////NO NEED TO EDIT BELOW THIS LINE////////////
var copyspeed=marqueespeed;
var pausespeed=(pauseit==0)? copyspeed: 0;
var actualheight=0;
var marqueeheight=0;
var cross_marquee;
function scrollmarquee()
{
if (parseInt(cross_marquee.style.top)>(actualheight)) //if scroller hasn't reached the end of its height
{
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed; //move scroller upwards
}
else //else, reset to original position
{
// clearTimeout (timerID);
// cross_marquee.style.top=parseInt(marqueeheight);
}
}
function initializemarquee()
{
cross_marquee=document.getElementById("vmarquee");
cross_marquee.style.top=500;
marqueeheight=document.getElementById("marqueecontainer").offsetHeight;
actualheight=cross_marquee.offsetHeight; //height of marquee content (much of which is hidden from view)
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1) //if Opera or Netscape 7x, add scrollbars to scroll and exit
{
cross_marquee.style.height=marqueeheight;
cross_marquee.style.overflow="scroll";
return;
}
timerID = setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll);
tekst = 'style.top: ' + parseInt(cross_marquee.style.top) + '\n';
tekst += 'actual height: ' + actualheight + '\n';
tekst += 'marqueeheight: ' + parseInt(marqueeheight);
alert (tekst);
}
if (window.addEventListener)
window.addEventListener("load", initializemarquee, false);
else if (window.attachEvent)
window.attachEvent("onload", initializemarquee);
else if (document.getElementById)
window.onload=initializemarquee;
function display(layerNumber)
{
hideLayers();
layerName = "layer"+layerNumber;
document.getElementById(layerName).style.visibility="visible";
currentLayer = layerNumber;
if (layerNumber == 2)
{
initializemarquee ();
}
}
function ShowNextLayer()
{
if (currentLayer < 2)
{
currentLayer++;
hideLayers();
layerName = "layer"+currentLayer;
document.getElementById(layerName).style.visibility="visible";
}
}
function ShowPreviousLayer()
{
if (currentLayer > 1)
{
currentLayer--;
hideLayers();
layerName = "layer"+currentLayer;
document.getElementById(layerName).style.visibility="visible";
}
}
function hideLayers()
{
var layerName = '';
for (i=1;i<=2;i++)
{
layerName = 'layer' + i;
document.getElementById(layerName).style.visibility="hidden";
}
}
</script>
</head>
<body onload="JavaScript:loadlayer();">
<div id="marqueecontainer" onmouseover="copyspeed=pausespeed;" onmouseout="copyspeed=marqueespeed;">
<div id="layer1">U bent geconfronteerd met asbest. Wees gerust. Bla neemt al uw zorgen weg. Bij particulieren en bedrijven. Alles in één hand.<br /><br />In nauw overleg met uw verzekeringsmaatschappij wassen wij dit varkentje van kop tot staart: sanering, reiniging en afvoer van besmet materiaal (ook dode staldieren), sloop, schoonmaak, herstel. Specialistisch werk, waaraan de overheid terecht strenge eisen stelt.<br /><br />(0000) 00 00 00<br /><br /><a href="JavaScript:showlayer2();" class="sub">Dit mag u van ons verwachten >>></a></div>
<div id="vmarquee" style="position:absolute;">
<div id="layer2">Werken volgens het boekje, conform de wettelijke voorschriften:<br /><br />- Asbest. Een wereld van regelgeving, zware certificeringen en strenge controles op werk- en arbeidsomstandigheden. Het is de wereld van Ureco.<br />- volgens BRL 5050 norm<br />- vanuit speciale asbestunits die aan de strengste veiligheidseisen voldoen<br />- met uitsluitend deskundig gediplomeerd personeel. HBO leidinggevend, DTA-gediplomeerd uitvoerend (deskundig toezichthouder asbest)<br />- met de meest moderne apparatuur<br />- met als prioriteit veiligheid voor mens, dier en milieu<br /><br />Wij garanderen dat u na sanering uw pand weer volledig veilig kunt betrekken, zonder enig risico. Eén telefoontje en uw zorgen zijn voorbij.<br />(0000) 00 00 00<br /><br /><a href="JavaScript:showlayer1()" class="sub"><<< Terug</a></div>
</div>
</div>
</body>
</html> |
Je kunt de pagina hier werkend zien.
:strip_icc():strip_exif()/u/25938/lekkerkontje.jpg?f=community)
:strip_exif()/u/3333/pumpkin_avatar.gif?f=community){kind=avatar}
, helaas ben ik niet zo'n held in javascript om het zelf te ontwikkelen.
:strip_icc():strip_exif()/u/148505/31bb5b263ef71bb4d5751e9a89035105.jpeg.jpg?f=community)
