[javascript] code werkt alleen op IE

[M4RTiN]

Hallo ik heb een intranet site gecreëerd in ons bedrijf, hier voeren we orders in. debiteuren bijhouden. Factuur administratie en Voorraad beheer...

Nu hebben we de data op 1 server, maar die kan verschillend zijn (dus verschillende servers)

nu is er een panel-sliding DIVje, die alle info van de server laat zien

dus OStype, MYSQL KB ruimte en gebruikersnaam enz.
onder IE werkt dit maar niet in Mozilla, maarja beiden moeten eigenlijk werken!

Oke dus ik begon te zoeken hoe dat kwam, alhoewel ik weinig kennis van javascript hebt. (het sliding principe heb ik ook maar gevonden op internet)

Ik kwam erachter via de javascript console van Mozilla dat

code:

el = src.parentElement

geen waarde heeft.

Dus ben ik gaan googlen en zoeken op GoT op dit fenomeen, maar kom tot nix concreets hoe ik src.parentElement tot crossbrowser goedmaak

Hoe kom ik nu achter zon probleem, Ik hoef hier geen kant en klare oplossing op maar meer een evtentuele werkgang/manier om zon probleem op te lossen!

dus foutenopsporing en tot fouteliminering enzo.

[BtM909]

Maakt Mozilla / NS geen gebruik van parentNode?

[ Voor 6% gewijzigd door BtM909 op 25-09-2003 15:51 ]

[crisp]

Gebruik de DOM viewer in Mozilla...

[paragon]

uhm misschien is meer code wat handiger maar is het niet this.parentNode

[M4RTiN]

hmm ik zie dat als ik een dergelijk aanpassing maak, dat src.childeren nu een lege waarde heeft, maar deze wordt nergens in het script gedefenieerd.

Dus is src.childeren nu een bepaald vaststaand object in javascript?
komt deze melding nu pas in de javascript console tevoorschijn omdat de eerste is opgelost? of is het een normale kettingreactie?

[M4RTiN]

op verzoek hier de code voor de slite (2 functies)

code:

  function slide(dir, index) {
    var elSlide = animArray[index]
    var elMenu = elSlide.parentElement
    if (!dir) {
      elMenu.style.pixelLeft-=elMenu._offset 
      if (elSlide.offsetLeft<=(-elMenu.style.pixelLeft)){
        elMenu.style.pixelLeft = -elSlide.offsetLeft
        //elMenu._arrow.innerText = test
      } else
      setTimeout("slide("+dir+","+index+")",15)
    } else
    {
      elMenu.style.pixelLeft+=elMenu._offset 
      if (elMenu.style.pixelLeft>=0){
        elMenu.style.pixelLeft = 0
        //elMenu._arrow.innerText = test
      } else
      setTimeout("slide("+dir+","+index+")",15)
    }
  }

  var animArray = new Array()

  function doSlide(src) {
    el = src.parentElement
    el._offset = src.offsetLeft/10
    el._arrow = src.children.tags("SPAN")[0]
    if (el._index==null) {
      el._index = animArray.length
      animArray[animArray.length] = src
    }
    if (el.style.pixelLeft != -src.offsetLeft)
      slide(false, el._index);
    else
      slide(true, el._index)
  }

[ Voor 5% gewijzigd door M4RTiN op 25-09-2003 15:57 ]

[crisp]

zo zegt het ons echt helemaal niets, post gewoon eens de code...

edit: ok, bedankt

edit2: pixelLeft en pixelTop zijn ook IE-uitvindingen, verder is children voor zover ik weet ook geen DOM, je zult de childNodes af moeten gaan.

[ Voor 62% gewijzigd door crisp op 25-09-2003 16:01 ]

[M4RTiN]

hmm hoe bedoel je je zult childnodes af moeten gaan?

en is het gezien mn kennis op javascript niet handiger om een crossbrowser slidingmenu te gaan zoeken

(alhoewel daar ook maar weinig van zijn die doen wat ik wil)

[crisp]

M4RTiN schreef op 25 September 2003 @ 16:03:
hmm hoe bedoel je je zult childnodes af moeten gaan?

en is het gezien mn kennis op javascript niet handiger om een crossbrowser slidingmenu te gaan zoeken

(alhoewel daar ook maar weinig van zijn die doen wat ik wil)

mwa, een slide-menuutje is echt niet zo heel erg moeilijk om te maken. Het script dat jij post is op zich zo slecht nog niet, en de kans is groot dat een willekeurig ander script dat je vind slechter is.

Heb je misschien nog een stukje HTML waar dit in gebruikt wordt? Maakt het wat makkelijker om even te testen

[M4RTiN]

hmm jazeker hierkomtie:

code:

CSS:

.sliderView {position: absolute; left: 0pt}
.sliderView DIV.slider {float: left; cursor: default; width: 3px; text-align: center; font-size: 10pt}
.sliderView SPAN.arrow {font: 12pt webdings}
.sliderView .contents {width: 90%; float: left; border-bottom: 1pt #EEEEEE solid; border-right: 1pt #D4D0C8 solid;  border-left: 1pt gray solid; border-top: 1pt gray solid;}

HTML:

<div class="sliderView" STYLE="top: 340pt; left: -400;">
 <div class="contents" STYLE="width: 380;">
  <? inhoud code in php enzo ?>
 </div>
 <div ONSELECTSTART="return false" ONCLICK="doSlide(this)" class="slider">
  <span class="arrow">[img]pic/servinfo.gif[/img]</span></div>
 </div>  
</div>

[paragon]

Mischien handig: http://www.w3.org/TR/2000...2-Core-20001113/core.html hmm het naslag boek wat ik hier heb is een stuk duidelijker maar toch...

[ Voor 86% gewijzigd door paragon op 25-09-2003 16:23 ]

[crisp]

snel opzetje, je moet het maar even aanpassen aan je eigen wensen verder:

HTML:

<html>
<head>
<title>slidertest</title>
<script type="text/javascript">

function slide(index) {

  var el = animArr[index];
  el._left -= (el._offset / 10) * el._state;
  if (el._left > 0) {
    el._left = 0;
    el.style.left = '0px';
    el._arrow.firstChild.nodeValue = '<';
    el._state *= -1;
  } else if (el._left < el._offset) {
    el._left = el._offset;
    el.style.left = el._offset + 'px';
    el._arrow.firstChild.nodeValue = '>';
    el._state *= -1;
  } else {
    el.style.left = Math.round(el._left) + 'px';
    setTimeout('slide('+index+')',15);
  }

}

var animArr = [];

function doSlide(src) {

  var el = src.parentNode;
  if (typeof el._index == 'undefined') {
    el._left = -src.offsetLeft;
    el._offset = -src.offsetLeft;
    el._state = 1;
    el._arrow = src.getElementsByTagName('span').item(0);
    el._index = animArr.length;
    animArr[el._index] = el;
  }

  slide(el._index);

}

</script>
<style type="text/css">

.sliderView {
  position: absolute;
  left: -380px;
  top: 100px;
}
.sliderView div.slider {
  float: left;
  cursor: pointer;
  cursor: hand;
}
.sliderView span.arrow {
  font-size: 12px;
}
.sliderView .contents {
  float: left;
  width: 380px;
  border-bottom: 1px #EEEEEE solid;
  border-right: 1px #D4D0C8 solid;
  border-left: 1px gray solid;
  border-top: 1px gray solid;
}

</style>
</head>
<body>

<div class="sliderView">
 <div class="contents">
  inhoud code in php enzo<br />
  inhoud code in php enzo<br />
  inhoud code in php enzo<br />
  inhoud code in php enzo<br />
 </div>
 <div onselectstart="return false" onclick="doSlide(this)" class="slider">
  <span class="arrow">&gt;</span>
 </div>  
</div>

</body>
</html>

[M4RTiN]

WOW

wel een komische situatie ik zat gekluisterd aan het scherm en ik schrok als een wilde toen ik erop klikte hehehe

alleen als ik dan klik slide hij niet terug. en evenals eerst een foutmeldingetje, heb ik wat fout gedaan? voor zover ik zag is er alleen wat aangepast in de functie. maarre wel knap gedaan!

[M4RTiN]

sorry mijn fout als ik je html compleet kopieer werkt het perfect!!!

mijn dank is groot!

[crisp]

M4RTiN schreef op 25 September 2003 @ 17:29:
sorry mijn fout als ik je html compleet kopieer werkt het perfect!!!

mijn dank is groot!

Ik heb in plaats van het plaatje even een groter/kleiner dan tekentje gebruikt. Een plaatje is echter ook niet zo moeilijk om er in te zetten, dus je moet maar even kijken...

[M4RTiN]

ik zag het zo was het origineel ook

ik ben nog ff aan het googlen geweest, ik heb alles nu zoals het hoort gekopieerd, maar nog steeds in mijn eigen intranet krijg ik

code:

Error: uncaught exception: [Exception... "Modifications are not allowed for this document"  code: "7" nsresult: "0x80530007 (NS_ERROR_DOM_NO_MODIFICATION_ALLOWED_ERR)"  location: "http://xxx/administratie/ini.js Line: 63"]

kan het liggen aan andere functies in mijn ini.js ??
volgens mij niet, komen geen variabelen ofzo overeen maar oke ik krijg 1 onbeantwoorde hit in de google discussie groeps

[Verwijderd]

http://groups.google.com/...%2540ja-web.de%26rnum%3D2

Ik krijg deze te zien.

[Rebels]

ik kom even heel n00bisch binnenvliegen hoor, maar:

ik kan toch voor heel wat ie tags de mozilla tags vinden, gewoon even het scripje kopieren en onder elkaar zetten en ipv de ie de mozilla tags

das mijn ervaring, maar dat waren vrij simpele scriptjes

[crisp]

M4RTiN schreef op 25 September 2003 @ 17:42:
ik zag het zo was het origineel ook

ik ben nog ff aan het googlen geweest, ik heb alles nu zoals het hoort gekopieerd, maar nog steeds in mijn eigen intranet krijg ik

[...]

kan het liggen aan andere functies in mijn ini.js ??
volgens mij niet, komen geen variabelen ofzo overeen maar oke ik krijg 1 onbeantwoorde hit in de google discussie groeps

Wat staat er op lijn 63 in ini.js?

Rebels schreef op 25 september 2003 @ 18:08:
ik kom even heel n00bisch binnenvliegen hoor, maar:

ik kan toch voor heel wat ie tags de mozilla tags vinden, gewoon even het scripje kopieren en onder elkaar zetten en ipv de ie de mozilla tags

das mijn ervaring, maar dat waren vrij simpele scriptjes

Mozilla tags? wat zijn dat?
Maar inderdaad, omzetten naar DOM methoden is meestal niet zo heel erg moeilijk, alleen in dit geval was het iets lastigerer door het gebruik van pixelLeft enzo, en vond ik het script niet erg duidelijk.
IE5+ ondersteund ook gewoon DOM, dus je hoeft dan geen browser-specifieke afvragingen te doen (behalve als je met events gaat klooien).

[ Voor 43% gewijzigd door crisp op 25-09-2003 18:28 ]

[Rebels]

crisp schreef op 25 September 2003 @ 18:25:
[...]

Mozilla tags? wat zijn dat?
Maar inderdaad, omzetten naar DOM methoden is meestal niet zo heel erg moeilijk, alleen in dit geval was het iets lastigerer door het gebruik van pixelLeft enzo, en vond ik het script niet erg duidelijk.
IE5+ ondersteund ook gewoon DOM, dus je hoeft dan geen browser-specifieke afvragingen te doen (behalve als je met events gaat klooien).

in de zin van:
in IE: die en deze tag
voor mozzila: zus en zo tag

[M4RTiN]

hmm regel 63 geeft " el._left = 0; "

maar uit de melding begrijp ik dat "javascript" geen recht heeft om dat te veranderen?

M4RTiN niet vatten, en uit de gevonden topic(s) van google komt er ook nix naar voren wat de fout naar voren zou leiden

[crisp]

M4RTiN schreef op 25 september 2003 @ 19:46:
hmm regel 63 geeft " el._left = 0; "

maar uit de melding begrijp ik dat "javascript" geen recht heeft om dat te veranderen?

M4RTiN niet vatten, en uit de gevonden topic(s) van google komt er ook nix naar voren wat de fout naar voren zou leiden

Hoe link je de js? relatief of absoluut? en indien absoluut, wel vanaf hetzelfde domein?

[M4RTiN]

ik link de js in dezelfde dir, gewoon met

code:

<script language="JavaScript1.2" src="ini.js"></script>

edit: en gewoon de functie tussen script te zetten helpt niet i.p.v. van linken

edit: 2 ik snap nu wel, dat iedereen gewoon in DOM zou moeten werken

[ Voor 63% gewijzigd door M4RTiN op 25-09-2003 21:28 ]

[crisp]

welke versie mozilla (of netscape) is dat precies? en welk platform/os?
en wat voor DTD gebruik je (HTML, XHTML, XML, geen)?
draait het geheel in frames of los?
heb je nog veel veranderd aan de html?

Hier in Moz1.3, 1.4 en 1.5 heb ik er geen problemen mee, dus ik sta eigenlijk een beetje voor een raadsel... vage melding moet ik zeggen...

je kan trouwens beter niet language="JavaScript1.2" gebruiken, beter is om gewoon type="text/javascript" te doen

[ Voor 15% gewijzigd door crisp op 25-09-2003 21:37 ]

[M4RTiN]

mozilla 1.4 final op win2k pro

dtd (nog) niet, het geheel draaid niet in frames en tsjah de html is euh gebleven zoals het was, alleen jou stukken heb ik vervongen.

Ik snap het wel als jullie willen dat ik eerst nog ff op zoektocht ga, jullie hebben me al enorm geholpen namelijk!

[M4RTiN]

crisp schreef op 25 september 2003 @ 21:36:

je kan trouwens beter niet language="JavaScript1.2" gebruiken, beter is om gewoon type="text/javascript" te doen

hier stond iets doms

[ Voor 27% gewijzigd door M4RTiN op 26-09-2003 10:42 ]