Toon posts:

[DHTML] hide layer in ander frame

Pagina: 1
Acties:

zondag 17 oktober 2004 16:34

Acties:

Verwijderd

Topicstarter
Hallo allemaal,

Ik heb het volgende script gevonden op webmasterworld.com geschreven door ene BlobFisk.
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

function reDo() { 
 window.location.reload(); 
 } 

window.onresize = reDo;

//Define global variables
var timerID = null;
var timeron = false;
var timecount = 400;
// Change this to the time delay that you desire
var what = null;
var newbrowser = true;
var check = false;

function init() { 
 if (document.layers) { 
 layerRef="document.layers"; 
 styleSwitch=""; 
 visibleVar="show"; 
 what ="ns4"; 
 } 
 else if(document.all) { 
 layerRef="document.all"; 
 styleSwitch=".style"; 
 visibleVar="visible"; 
 what ="ie4"; 
 } 
 else if(document.getElementById) { 
 layerRef="document.getElementByID"; 
 styleSwitch=".style"; 
 visibleVar="visible"; 
 what="dom1"; 
 } 
 else { 
 what="none"; 
 newbrowser = false; 
 } 
check = true; 
} 

// Toggles the layer visibility on 
function showlayer(layerName) { 
 if(check) { 
 if (what =="none") { 
 return; 
 } 
 else if (what == "dom1") { 
 document.getElementById(layerName).style.visibility="visible"; 
 } 
 else { 
 eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="visible"'); 
 } 
 } 
 else { 
 return; 
 } 
 } 
 
 // Toggles the layer visibility off 
function hidelayer(layerName) { 
 if(check) { 
 if (what =="none") { 
 return; 
 } 
 else if (what == "dom1") { 
 document.getElementById(layerName).style.visibility="hidden"; 
 } 
 else { 
 eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"'); 
 } 
 } 
 else { 
 return; 
 } 
 } 
 
function hideAll() { 
 hidelayer('layer1'); 
 hidelayer('layer2'); 
 //Put all layers used in the nav here. 
 //Copy the hidelayer() function above. 
 } 
 
function startTime() { 
 if (timeron == false) { 
 timerID=setTimeout( "hideAll()" , timecount); 
 timeron = true; 
 } 
 } 
 
function stopTime() { 
 if (timeron) { 
 clearTimeout(timerID); 
 timerID = null; 
 timeron = false; 
 } 
 }
 
 function onLoad() { 
 init(); 
 }

en in html bijvoorbeeld het volgende:
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

<body onLoad="init();">
<div id=layer1 style="width: 208px; height: 52px; position:absolute; z-index:1; left: 31px; top: 84px; visibility: hidden;">
<table width="200" border="1">
  <tr>
    <td><a href="#" onMouseOver="hideAll(); showlayer('layer1'); stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
  </tr>
  <tr>
    <td><a href="#" onMouseOver="hideAll(); showlayer('layer1'); stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
  </tr>
  <tr>
    <td><a href="#" onMouseOver="hideAll(); showlayer('layer1'); stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
  </tr>
</table>
</div>
<div id=layer2 style="width: 208px; height: 52px; position:absolute; z-index:1; left: 310px; top: 81px; visibility: hidden;">
  <table width="200" border="1">
    <tr>
      <td><a href="#" onMouseOver="hideAll(); showlayer('layer2'); stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
    </tr>
    <tr>
      <td><a href="#" onMouseOver="hideAll(); showlayer('layer2'); stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
    </tr>
    <tr>
      <td><a href="#" onMouseOver="hideAll(); showlayer('layer2');stopTime()" onMouseOut="startTime();">[img]"nieuw_07.gif"[/img]</a></td>
    </tr>
  </table>
</div>

Dit script zorgt ervoor dat de desbetreffende layer na een tijdsvertraging hidden wordt.
Het script werkt goed ik heb het getest in 1 pagina zoals hierboven.

Maar nu ben ik bezig om het in een frameset te laten werken.
frame1
frame2
en een index

Ik laad het javascript gedeelte als apparte file in beide frames en ook de "init();" functie in de body van beide frames.

Nu heb ik in frame1 bv twee knoppen:
code:
1
2

<a href="#" onMouseOver="hideAll(); showlayer(parent.frame2,'layer1');">[img]"knop1.gif"[/img]</a>
<a href="#" onMouseOver="hideAll(); showlayer(parent.frame2,'layer2');">[img]"knop2.gif"[/img]</a>

En in frame2 de layers 1 + 2 zoals in bovenstaande HTML code.

Volgens mij is wat ik in frame1 heb staan goed.
Tijdens een mouseover show layer1 in frame2.
Alleen in mozzilla werkt dit niet en in IE ook niet en krijg in IE de volgende foutmelding wanneer ik over knop1 beweeg:
code:
1
2

regel70
document.all.layer1.style is leeg of geen object

Alleen de hideAll() heb ik mijn bedenkingen over ik snap niet hoe ik kan aangeven dat dit ook in een andere frame moet werken?


Zou iemand mij AUB opweg willen helpen?
Reageer