Mozilla und document.write mit StyleSheets

[MichaelB]

Hallo allerseits,

ich habe eine normale HTML-Seite, bei der im BODY folgender Abschnitt steht:
<script language="JavaScript" type="text/javascript">
  <!--
     for(var i = 1; i <= 6; i++) {
      document.write("<a href="javascript:load_url("+i+");">");
      document.write("<div style="position:absolute;
          top:"+(i*100+8)+"px; left:750px; height:80px; width:215px;
           cursor:hand;">");
      document.write("<p id="element"+i+"" > </p></div></a>");
     }
  //-->
</script>

Soweit so gut. Im InternetExplorer (6) macht er das auch wunderbar. Er positioniert die Elemente richtig und es erscheint auch eine Hand, wenn man mit der Maus über die durch DIV definierten Elemente geht.

Im Mozilla (ich hab hier die 1.6) positioniert er auch alles richtig, aber es erscheint die Hand nicht die ja durch das StyleSheet cursor:hand festgelegt wird.
Wenn man sich die Stuktur im Mozilla-DOM-Inspector anschaut, dann sieht man auch alle StyleSheet-Angaben korrekt eingebunden. Nur eben nicht das cursor:hand;. Das scheint also die Mozilla nicht mit zu interpretieren. Wenn man den HTML-Code normal hinschreibt (also ohne Javascript und document.write), dann funktioniert es auch im Mozilla. Ich würde aber trotzdem lieber die obige, schlankere Programmierung bevorzugen.

Was kann man da machen bzw. ist bekannt, daß der Mozilla bestimmte Style-Angaben auf diese Weise nicht interpretiert? Meine Suche blieb bisher erfolglos.

Danke im Voraus für eventuelle Antworten.

Gruß
   MichaelB

[Eine "Lösung"]

Hallo nochmal,

sämtliche Mitglieder des Forums können aufhören zu grübeln :-)
Ich habe zumindest ... eine Lösung.
Man ersetze DIV durch SPAN und dann klappt es auch unter Mozilla.

Funktioniert, aber wundern tut es mich doch das er mit dem DIV-Tag Schwierigkeiten hat. Vielleicht hat ja jemand ein paar Hintergrundinformationen.

Gruß
  Michael

[Cheatah]

Hi,

Man ersetze DIV durch SPAN und dann klappt es auch unter Mozilla.

Grund: Die Schachtelung <a><span/></a> ist erlaubt, somit wird - nach Ignorieren der falschen cursor-Angabe - das Standardverhalten eines Links angenommen.

Cheatah

[Cheatah]

Hi,

Im Mozilla (ich hab hier die 1.6) positioniert er auch alles richtig, aber es erscheint die Hand nicht die ja durch das StyleSheet cursor:hand festgelegt wird.

ist das zu fassen. Und dass, wo die cursor-Eigenschaft überhaupt keinen Wert "hand" kennt.

Möchtest Du nicht vielleicht verstärkt die Standards konsultieren, wenn Du unvalidierbaren Code erzeugst? http://validator.w3.org/ Wird Dir nur Fehler melden, die damit zusammenhängen, dass "</" den <script>-Bereich beendet; nicht jedoch die Schachtelungsfehler. Und http://jigsaw.w3.org/css-validator/ kann Dir die CSS-Fehler ebenfalls nicht mitteilen.

Wenn man den HTML-Code normal hinschreibt (also ohne Javascript und document.write), dann funktioniert es auch im Mozilla.

Ganz bestimmt nicht _diesen_ HTML-Code.

Was kann man da machen bzw. ist bekannt, daß der Mozilla bestimmte Style-Angaben auf diese Weise nicht interpretiert?

Mozilla verfügt nicht über die Fehlerkorrekturen eines IE.

Cheatah

[MichaelB]

Hallo Cheatah,

Danke erstmal für die umfangreiche Antwort.

Im Mozilla (ich hab hier die 1.6) positioniert er auch alles
richtig, aber es erscheint die Hand nicht die ja durch
das StyleSheet cursor:hand festgelegt wird.
ist das zu fassen. Und dass, wo die cursor-Eigenschaft überhaupt keinen Wert "hand" kennt.

Argh. Man sollte nicht alles ungeprüft glauben, was man so hört. Stimmt. Selbst in SelfHTML ist das nichtmal erwähnt, obwohl da ja auch ab und zu mal nicht-standardkonforme Sachen erklärt werden.

Wenn man den HTML-Code normal hinschreibt (also ohne Javascript und document.write), dann funktioniert es auch im Mozilla.

Ganz bestimmt nicht _diesen_ HTML-Code.

Sorry. Aber ich bin ja nicht ganz blöd. Ich kann zumindest das wiedergeben, was ich sehe. Ich habe den Code hier noch vor mir und er läuft im Mozilla.

Was kann man da machen bzw. ist bekannt, daß der Mozilla bestimmte Style-Angaben auf diese Weise nicht interpretiert?

Mozilla verfügt nicht über die Fehlerkorrekturen eines IE.

Schade eigentlich, wenns mal schnell gehen muss. :-)

Ist eigentlich jemandem ein (von mir aus auch kostenpflichtiges) brauchbares HTML-Erstellungstool bekannt? Ich komme ja eher aus der Programmiererecke und da ist man natürlich verwöhnt mit Compiler die einem bei Syntaxfehlern (in HTML, Javascript und CSS) gleich Auskunft geben. Tidy ist ja schon ganz ok aber versagt halt bei Javascript und CSS-Sachen sowie bei HTML-Code in beispielsweise document.write und ähnlichem.
Auch Erstellungshilfen wären ganz nett. HTML-Kit ist da ja in sofern schon nicht schlecht, als dass zu einem Tag zumindest die verfügbaren Attribute angeboten werden. Aber diese Funktionalität auch für CSS und Javascript wäre schon ganz nett.

Gruß
  MichaelB

[Cheatah]

Hi,

Ganz bestimmt nicht _diesen_ HTML-Code.
Sorry. Aber ich bin ja nicht ganz blöd. Ich kann zumindest das wiedergeben, was ich sehe. Ich habe den Code hier noch vor mir und er läuft im Mozilla.

ich wollte Dir nicht zu nahe treten, sorry. Was ich meinte: Mozilla behebt einige Code-Fehler, insbesondere um DOM-Zugriffe zu ermöglichen - Stichwort "View Selection Source" im Kontextmenü eines markierten Bereiches. Ich kann mir vorstellen, dass der Vorgang bei Generierung durch JavaScript anders ist als bei "direkt" vorliegendem Code; möglicherweise bedingt durch andere Fehler, etwa den "</" im <script>-Bereich. Somit werden die Strukturfehler im einen Fall behoben, im anderen nicht.

Ist eigentlich jemandem ein (von mir aus auch kostenpflichtiges) brauchbares HTML-Erstellungstool bekannt?

Die besten Ergebnisse erzielt man gewöhnlich mit Texteditoren.

Ich komme ja eher aus der Programmiererecke und da ist man natürlich verwöhnt mit Compiler die einem bei Syntaxfehlern (in HTML, Javascript und CSS) gleich Auskunft geben.

Ich könnte mir vorstellen, dass Eclipse auch mit HTML und CSS zurechtkommt. Die Schwierigkeit wird in der Menge unterschiedlicher Techniken liegen, die im selben Dokument koexistieren, welches nach in ihm beschriebenen Indizien (z.B. Doctype, Encoding) unterschiedlichen Regeln folgt.

Auch Erstellungshilfen wären ganz nett.

Einem XML-Editor wird man sicher das HTML-Set beibringen können.

Aber diese Funktionalität auch für CSS und Javascript wäre schon ganz nett.

Spätestens bei JavaScript empfehle ich, bewusst auf Hilfen zu verzichten. Ohne individuell angewendetes Wissen und Erfahrung kommt man hier nicht weit.

Cheatah

[MichaelB]

Hallo Cheatah,

Ganz bestimmt nicht _diesen_ HTML-Code.
Sorry. Aber ich bin ja nicht ganz blöd. Ich kann zumindest das wiedergeben, was ich sehe. Ich habe den Code hier noch vor mir und er läuft im Mozilla.

ich wollte Dir nicht zu nahe treten, sorry. Was ich meinte: Mozilla behebt einige Code-Fehler, insbesondere um DOM-Zugriffe zu ermöglichen - Stichwort "View Selection Source" im Kontextmenü eines markierten Bereiches. Ich kann mir vorstellen, dass der Vorgang bei Generierung durch JavaScript anders ist als bei "direkt" vorliegendem Code; möglicherweise bedingt durch andere Fehler, etwa den "</" im <script>-Bereich. Somit werden die Strukturfehler im einen Fall behoben, im anderen nicht.

Kann durchaus sein. Klingt nicht ganz unplausibel.

Ist eigentlich jemandem ein (von mir aus auch kostenpflichtiges) brauchbares HTML-Erstellungstool bekannt?

Die besten Ergebnisse erzielt man gewöhnlich mit Texteditoren.

Sehr witzig. :-)

Ich komme ja eher aus der Programmiererecke und da ist man natürlich verwöhnt mit Compiler die einem bei Syntaxfehlern (in HTML, Javascript und CSS) gleich Auskunft geben.

Ich könnte mir vorstellen, dass Eclipse auch mit HTML und CSS zurechtkommt. Die Schwierigkeit wird in der Menge unterschiedlicher Techniken liegen, die im selben Dokument koexistieren, welches nach in ihm beschriebenen Indizien (z.B. Doctype, Encoding) unterschiedlichen Regeln folgt.

Jo. Das ist in der Tat ein Problem. Aber kein Unlösbares. Mich wundert, daß bisher scheinbar noch keiner einen solchen Editor auf die Beine gestellt hat. Da findet sich doch bestimmt Bedarf für.
Eclipse könnte man mal probieren. Da findet sich bestimmt auch ein geeignetes PlugIn zu. Von Hause aus ist es ja mit den HTML-Fähigkeiten nicht allzu weit her.

Auch Erstellungshilfen wären ganz nett.
Einem XML-Editor wird man sicher das HTML-Set beibringen können.

Jo. Sowas habe ich mir auch schon überlegt. Die DTD ist ja quasi die Syntaxbeschreibung und die liegt ja auf der W3C-Seite zur Verwendung.

Aber diese Funktionalität auch für CSS und Javascript wäre schon ganz nett.

Spätestens bei JavaScript empfehle ich, bewusst auf Hilfen zu verzichten. Ohne individuell angewendetes Wissen und Erfahrung kommt man hier nicht weit.

Ja schon. Solche Hilfen können natürlich nicht Wissen und Erfahrungen ersetzen. Aber ganz hilfreich wäre es schon, wenn man beispielsweise zu einer Javascript-Funktion angezeigt bekommen würde, welche Parameter sie kennt oder zu einem Objekt welche Unterobjekten und Methoden das zur Verfügung stellt. So muss man jedesmal nachschlagen. Denn meist weiß man ja schon, was man will. Nur in der Praxis hat weiß man nicht immer den genauen Wortlaut oder auch die exakte Groß- /Kleinschreibung usw. Und da würde es schon die Sache etwas angenehmer machen.

Gruß
  Michael

[Jens Holzkämper]

Tach,

Ich komme ja eher aus der Programmiererecke und da ist man natürlich verwöhnt mit Compiler die einem bei Syntaxfehlern (in HTML, Javascript und CSS) gleich Auskunft geben.

Dafür gibts doch http://validator.w3.org und http://jigsaw.w3.org/css-validator/.

Jo. Das ist in der Tat ein Problem. Aber kein Unlösbares. Mich wundert, daß bisher scheinbar noch keiner einen solchen Editor auf die Beine gestellt hat.

Das liegt wohl daran, daß Cheatah das hier

Die besten Ergebnisse erzielt man gewöhnlich mit Texteditoren.
Sehr witzig. :-)

nicht als Witz sondern Ernst meint.

mfg
Woodfighter

[Cybaer]

Hi,

Im Mozilla (ich hab hier die 1.6) positioniert er auch alles richtig, aber es erscheint die Hand nicht die ja durch das StyleSheet cursor:hand festgelegt wird.

Der IE richtet sich hier (wieder einmal) nicht nach dem Standard. Verwende "cursor:pointer; cursor:hand;", dann klappt es auch mit Nicht-IEs.

Gruß, Cybaer

[Ingo Turski]

Hi,

Der IE richtet sich hier (wieder einmal) nicht nach dem Standard. Verwende "cursor:pointer; cursor:hand;", dann klappt es auch mit Nicht-IEs.

wieso zusätzlich hand? Welche IEs verstehen pointer denn nicht?

freundliche Grüße
Ingo

[Cybaer]

Hi,

wieso zusätzlich hand? Welche IEs verstehen pointer denn nicht?

IE Win 3 (hehe ;-)), 4, 5 und 5.5. Der 6er möglicherweise nicht im Quirksmode (weiß ich aber nicht).

Gruß, Cybaer

[Ingo Turski]

Hi,

wieso zusätzlich hand? Welche IEs verstehen pointer denn nicht?

IE Win 3 (hehe ;-)), 4, 5 und 5.5. Der 6er möglicherweise nicht im Quirksmode (weiß ich aber nicht).

Danke. Übrigens: der IE6 kennt das auch im Quirks-Mode. Aber die alten IEs wären mir diese zusätzliche Angabe eigentlich nicht Wert.

freundliche Grüße
Ingo

[MichaelB]

Hallo,

Im Mozilla (ich hab hier die 1.6) positioniert er auch alles richtig, aber es erscheint die Hand nicht die ja durch das StyleSheet cursor:hand festgelegt wird.

Der IE richtet sich hier (wieder einmal) nicht nach dem Standard.

Dann aber der Mozilla auch nicht. Ohne document.write klappt es ja.

Verwende "cursor:pointer; cursor:hand;", dann klappt es auch mit Nicht-IEs.

Danke für den Tipp.

Gruß
   MichaelB