Check alle échte Black Friday-deals Ook zo moe van nepaanbiedingen? Wij laten alleen échte deals zien

Uitklap menu werkt in IE, niet in andere browsers

Pagina: 1
Acties:
  • 193 views sinds 30-01-2008
  • Reageer

  • Duncank
  • Registratie: December 2007
  • Laatst online: 29-11 09:06
Ik ben bezig met het maken van een nieuwe site. Hierin komt een uitklap menu te staan. Wat ik hiermee bedoel kun je hier zien -> http://www.ng-tv.nl/ng2008

Maar dit menu werkt alleen in internet explorer, niet in andere browsers, dan ziet het er raar uit en staat het op de verkeerde plaats.

Kan iemand mij helpen door iets in de code van dit menu te herschrijven, of door mij aan een ander menu te helpen, dat er hetzelfde uitziet als dit, maar wel werkt in alle browsers (en dan vooral firefox en ie aub.)

dit is t css gedeelte:
code:
1
2
3
4
5
6
7
8
9
10
<style>

DIV.clTop{position:absolute; width:200}
DIV.clSub{position:absolute; left:0; width:200}
#divCont{position:relative; left:23; top:0; height:100%; width:200;}
A.clMain{font:30px Arial Black; text-decoration:none; color:#aba9a9; line-height:1}
A.clMain:hover{font:30px Arial Black; text-decoration:none; color:#aba9a9; line-height: 1}
A.clSubb{font:12px Arial Black; text-decoration:none; color:#e4e4e4}
#divMain{position:absolute}
</style>


t is het head-gedeelte wat betrekking heeft op t menu:
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
<script language="JavaScript">
var stayFolded=false

var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
var browser=((n || ie) && parseInt(navigator.appVersion)>=4)  


function makeMenu(obj,nest){
   nest=(!nest) ? '':'document.'+nest+'.'                                        
   this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+ob  j+'.style')                    
      this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('docum  ent');        
   this.height=n?this.ref.height:eval(obj+'.offsetHei  ght')
   this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;                            
   this.hideIt=b_hideIt;    this.showIt=b_showIt; this.vis=b_vis; this.moveIt=b_moveIt                                            
   return this
}
function b_showIt(){this.css.visibility="visible"}
function b_hideIt(){this.css.visibility="hidden"}
function b_vis(){if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}

// vanaf hier niets veranderen

function init(){
   oTop=new Array()
   oTop[0]=new makeMenu('divTop1','divCont')
   oTop[1]=new makeMenu('divTop2','divCont')
   oTop[2]=new makeMenu('divTop3','divCont')
   oSub=new Array()
   oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')
   oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')
   oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')
   for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }
   for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) }
}

// Vanaf hier niets veranderen.


function menu(num){
   if(browser){
       if(!stayFolded){
           for(i=0;i<oSub.length;i++){
               if(i!=num) oSub[i].hideIt()
           }
           for(i=1;i<oTop.length;i++){
               oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
           }
       }
       oSub[num].vis()?oSub[num].showIt():oSub[num].hideIt()
       for(i=1;i<oTop.length;i++){ 
           if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height) 
           else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
       }
   }
}
//Laat het menu laden, if it's a 4.x+ browser.
if(browser) onload=init;

</script>


En dit zit in de body, hierin staan de links etc.

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
<div align="top"><div id="divCont"> 
              <div id="divTop1" class="clTop"><a href="radio" onClick="menu(0); return false" class="clMain">RADIO</a><hr size="1" color="#aba9a9">
                <div id="divSub1" class="clSub"> 
                  <a href="radionieuws.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Nieuws</a><br>
                  <a href="radioagenda.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Agenda</a><br>
                  <a href="frequenties.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Frequenties</a><br>
                  <a href="playlist.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Playlist</a><br>
                  <a href="radioacties.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Acties/Meedoen</a><br>
                  <a href="media/index.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Mediaplayer</a><br><br>
                </div>
                              </div>
              <div id="divTop2" class="clTop"><a href="tv" onClick="menu(1); return false" class="clMain">TV</a><hr size="1" color="#aba9a9">
                <div id="divSub2" class="clSub"> 
                  <a href="tvnieuws.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Nieuws</a><br>
                  <a href="tvagenda.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Agenda</a><br>
                  <a href="tvtip.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Filmpje/Tip Insturen</a><br>
                  <a href="tvacties.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Acties/Meedoen</a><br>
                  <a href="media/index.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Mediaplayer</a><br><br>
                </div>
                              </div>
              <div id="divTop3" class="clTop"><a href="team" onClick="menu(2); return false" class="clMain">TEAM</a><hr size="1" color="#aba9a9">
                <div id="divSub3" class="clSub"> 
                  <a href="teamduncan.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Duncan</a><br>
                  <a href="teamgj.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Gert-Jan</a><br>
                  <a href="teammark.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Mark</a><br>
                  <a href="teamymar.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Ymar</a><br>
                  <a href="teamsimone.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Simone</a><br>
                  <a href="teamsuzanne.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Suzanne</a><br>
                  <a href="teamtim.html" target="hoofd" class="clSubb"><img src="images/prelink.png" width="12" height="12" alt="" border="0"> Tim</a><br><br>
                </div>
                              </div>
                         </div></div>

Ik hoop dat iemand mij kan helpen, alvast bedankt!

  • disjfa
  • Registratie: April 2001
  • Laatst online: 04-11 11:05

disjfa

be

In je javascript word de vergelijking tussen netscape en internet exporer (uit die tijd nummer 4 neem ik aan) gemaakt.

Tegenwoordig hebben we nieuwere browsers ;) Nieuwere scripts die gemakkelijker te interpreteren zijn. Logischer opgebouwde html wat we kunnen bouwen. etc etc.

Zoek een script wat ook maar richting 2007 ipv 1997 bedacht is :) Daar kan jij al veel meer mee, en wij kunnen daar makkelijker mee omgaan.

[ Voor 3% gewijzigd door disjfa op 12-12-2007 09:20 ]

disjfa - disj·fa (meneer)
disjfa.nl


  • armageddon_2k1
  • Registratie: September 2001
  • Laatst online: 27-07 10:18
Zoek eens op Suckerfish, dan moet je een end komen.

Engineering is like Tetris. Succes disappears and errors accumulate.


  • Duncank
  • Registratie: December 2007
  • Laatst online: 29-11 09:06
Suckerfish is niet precies wat ik zoek eigelijk. Ik zoek een menu verglijkbaar met het menu wat je ziet als je in internet explorer http://www.ng-tv.nl/ng2008 opent. Die 3 knoppen aan de rechterkant (Radio, tv en team) die wanneer je er op klikt uitschuiven. Hoop dat iemand hier iets op weet.

@disjfa: kan ik niet iets in de javascript veranderen zodat ie moderner werkt eigelijk?

  • BtM909
  • Registratie: Juni 2000
  • Niet online

BtM909

Watch out Guys...

Je kan suckerfish wel gebruiken en kijken hoe je de onmouseover verandert in onclick ;)

Een beetje zelfinzet is wel gewenst hoor, want even een script hier afhalen is niet helemaal de bedoeling.



Wil je je javascript aanpassen zodat ie moderner werkt, dan lijkt het me verstandig om eens wat goede blogs bij te gaan houden en te kijken naar moderne technieken. Even wat wijzigen maakt je JS niet moderner; het is meer de gedachte en 't ontwerp erachter :)

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.