getElementsByTagName

[neuroleptika]

Hi Bernhard,
clear funktioniert nur mit Blockelementen.
Du hättest also auch clear: none; schreiben können.
* Ich fürchte das funktioniert nur solange .content höher ist wie #navi.

Warum darf es in deinem Script eigentlich kein bild-0.gif geben?

* Edit (IE6):
Ich habe mich geirrt.
Der IE6 braucht hier kein clear. #wrapper wächst auch so mit.
Durch die Angaben zu height und width hat #wrapper layout.

 

[Bernhard]

Hi Bernhard,
clear funktioniert nur mit Blockelementen.
Du hättest also auch clear: none; schreiben können.
* Ich fürchte das funktioniert nur solange .content höher ist wie #navi.

Warum darf es in deinem Script eigentlich kein bild-0.gif geben?

* Edit (IE6):
Ich habe mich geirrt.
Der IE6 braucht hier kein clear. #wrapper wächst auch so mit.
Durch die Angaben zu height und width hat #wrapper layout.

Hallo Neuroleptika,

scheint keine Probleme zu geben - muss aber zum Schluss eh in allen Browsern testen,
u.a. weil auch eine etwas aufwändigere Navi drin ist...

b.t.w.: weißt Du zufällig, on man IE6 mit ausgeschaltetem JS ein eigenes CSS geben
kann? Hab noch nicht gegoogelt - und auch noch nicht getestet, denke aber an
sowas in der Art:

<!--[if lt IE 7]><noscript><link href="ie6-o-js.css" rel="stylesheet" type="text/css" media="screen" /></noscript><![endif]-->

Ein bild-0.gif gibt es jetzt auch, und am JS hab ich auch nochmal gefummelt...
http://www.virtual.bplaced.net/de/glaeser/

Für heute geb ich's auf...

Viele Grüße
Bernhard

Edit: IE7 braucht die ganzen style-Angaben genauso wie der sechser...

 

[neuroleptika]

Hi Bernhard,
du verwendest doch schon Conditional Comments.

Ich würde nur eine css-Datei für alle IE <=7 schreiben:

<link href="../../includes/style-de.css" rel="stylesheet" type="text/css" />

<!--[if lt IE 8]>
<link href="../../includes/ie.css" rel="stylesheet" type="text/css"  />
<![endif]-->

  <script type="text/javascript">
  /* <![CDATA[ */
document.write("<link href="../../includes/js.css" rel="stylesheet" type="text/css"  />"); 
  /* ]]> */
  </script>

In der ie.css kannst die Anweisungen für IE <= 7 notieren / überschreiben.
Mit dem Sternchenhack (* html selektor {}) kannst du einzelne Anweisungen vor dem IE7 verstecken.

In der js.css würdest du die Werte für alle Browser mit Javascript überschreiben.

Eine print.css würde ich erst schreiben wenn alles andere funktioniert.

 

[Bernhard]

Hi Bernhard,
du verwendest doch schon Conditional Comments.

Klar...;-)

Ich würde nur eine css-Datei für alle IE <=7 schreiben:

<link href="../../includes/style-de.css" rel="stylesheet" type="text/css" />

<!--[if lt IE 8]>
<link href="../../includes/ie.css" rel="stylesheet" type="text/css"  />
<![endif]-->

  <script type="text/javascript">
  /* <![CDATA[ */
document.write("<link href="../../includes/js.css" rel="stylesheet" type="text/css"  />"); 
  /* ]]> */
  </script>

In der ie.css kannst die Anweisungen für IE <= 7 notieren / überschreiben.
Mit dem Sternchenhack (* html selektor {}) kannst du einzelne Anweisungen vor dem IE7 verstecken.

In der js.css würdest du die Werte für alle Browser mit Javascript überschreiben.

Hallo Neuroleptika,

hmmm, mal sehen, wie ich es mache: die Site bekommt ein Ausklappmenü.
Bisher hab ich bei DropDown- oder Ausklappmenüs extra wegen dem IE (der
dafür JS benötigt) Übersichtsseiten angelegt. Diese würden aber bei der
Struktur dieser Site eher verwirren, als für Übersicht sorgen.
D.h. ich muss dem IE6 bei deaktiviertem JavaScript (den noch älteren auch
bei aktiviertem JS) ein völlig anderes CSS für die Navi geben...

Eine print.css würde ich erst schreiben wenn alles andere funktioniert.

Auch klar. Da stehen bislang auch nur rudimentäre Angaben drin...

Bis auf das JavaScript funktioniert auch alles
(O.K. das Stylesheet für IE vor 6 fehlt noch vollständig)...

Grüße
Bernhard

Edit: jetzt hab ich Deinen Vorschlag mal umgesetzt und im Head eine js.css eingebaut...

#galerie dl dt,#galerie dl dt img,#galerie dl dt dd {
    display:none;
}

Damit funktioniert das Script nicht mehr: initGalerie() geht einwandfrei, alles
weitere wird ignoriert - da beißt sich also wohl inline JavaScript mit externem...

Eine Erklärung könnte evtl. das hier sein: http://www.evotech.net/blog/2007/05/including-javascript-in-xhtml/

http://www.virtual.bplaced.net/de/glaeser/

Außerdem kämpfe ich immer noch damit, das eigentliche Galerie-Script dazu
zu bringen, fehlerfrei zu funktionieren...;-(

 

[neuroleptika]

Ich habe micht vertippt:

document.write("<link href="../../includes/js.css" rel="stylesheet" type="text/css"  />");

richtig:

document.write("<link type='text/css' href='../../includes/js.css' rel='stylesheet'>");

Durch deine Schleifen steige ich nicht durch. Ich bin in sowas nicht besonders geschickt.

 

[crash]

Wozu das document.write() mit einem Stylesheet?

Wenn Ihr Angaben wollt, die nur greifen, wenn JavaScript an ist, dann erstellt eine zweite CSS-Datei "noscript.css" und setzt diese nach der "normale" CSS-Datei (zwecks Kaskaden).

#irgendeinHinweis{
    display:block;
}

in der normalen CSS-Datei:

#irgendeinHinweis{
   display:none;
}

Die noscipt.css kann man einfach mit linkRef.disabled = true; ausschalten und display:none; greift.

 

[neuroleptika]

Die Listenelemente sollten sammt Grafiken geladen und angezeigt werden.

Nur wenn JavaScript an ist sollten alle bis auf eine wieder ausgeblendet werden.
Da erschien es mir am einfachsten eine weitere css-Datei mit document.write() einzufügen in der diese Elemente wieder ausgeblendet werden.

Ich bin kein Programmierer ;-)

 

[Bernhard]

Hallo Neuroleptika,
hallo Crash,

aaarrrggghhh - die Probleme werden mehr, statt weniger, aber der Reihe nach...

Ich habe micht vertippt:

document.write("<link href="../../includes/js.css" rel="stylesheet" type="text/css"  />");

richtig:

document.write("<link type='text/css' href='../../includes/js.css' rel='stylesheet'>");

Ja, das mit den einfachen Anführungszeichen statt der doppelten klingt logisch.
Hat es einen Grund, dass Du die Reihenfolge geändert hast?
(type='text/css' nach vorne geholt)

Aber das display:none;, das ich damit erreiche, bekomme ich anschließend mit
meinem JavaScript nicht wieder weg...

(hab die Zeile erstmal auskommentiert, bis ich das gefixed habe)

Durch deine Schleifen steige ich nicht durch. Ich bin in sowas nicht besonders geschickt.

Ich steig da auch nur zur Hälfte durch...;-(

Wozu das document.write() mit einem Stylesheet?

Wenn Ihr Angaben wollt, die nur greifen, wenn JavaScript an ist, dann erstellt eine zweite CSS-Datei "noscript.css" und setzt diese nach der "normale" CSS-Datei (zwecks Kaskaden).

#irgendeinHinweis{
    display:block;
}

in der normalen CSS-Datei:

#irgendeinHinweis{
   display:none;
}

Die noscipt.css kann man einfach mit linkRef.disabled = true; ausschalten und display:none; greift.

Momentan sind zum Testen Bilder mit sehr geringer Dateigröße drin.
Später kann ein Bild durchaus 10 - 20 KB haben und es können auch mal deutlich
mehr als zehn Bilder werden.
Dann wäre während des Ladens die komplette Liste zu sehen und auch der Scrollbalken.
Da das irritieren könnte, hat mir Neuroleptika diese Lösung vorgeschlagen.
Mit anderen Angaben im Stylesheet sollte ich das auch in den Griff bekommen...

Ich bin da aber gerne offen für andere / bessere Vorschläge...
Funktionieren soll's - und nach Möglichkeit sollte es ordentlich sein...

linkRef.disabled = true;

Wo kommt das hin?

Magst Du Dir mein JavaScript bitte nochmal anschauen und mir einen Tipp geben,
warum es nicht funktioniert? (http://www.virtual.bplaced.net/de/glaeser/)

Jetzt zu meinem ersten Satz oben: beim IE6 hab ich jetzt erst ein neues Problem
entdeckt...
Der braucht das .htc, um ver auf andere Elemente als <a href="#"> anwenden
zu können...
Das brauche ich, weil ich eine Ausklapp-Navigation vorgesehen habe.
Wenn ich die Seite aufrufe funktioniert das auch, wenn ich aber einmal auf einen
der auf-/ab-Pfeile oder einen Thumbnail geklickt habe, funktioniert es nicht mehr...;-(

Da scheint also das JavaScript das .htc zu blockieren.
Was kann man da machen?

Grüße
Bernhard

 

[neuroleptika]

Das behavior-Problem hast du gelöst?
Der IE6 scheint sich nicht mehr drann zu stören.

Vielleicht wäre das ein Ansatz:

 function bild(n)
{
n = bildNummer(n);
if (n == 0)
{
//blende das startbild ein
}
else {
//for-schleife
}
}

 

[Bernhard]

Hallo Neuroleptika,

Das behavior-Problem hast du gelöst?
Der IE6 scheint sich nicht mehr drann zu stören.

Hab jetzt mal die Navigation ergänzt, damit man das Problem sieht:
http://www.virtual.bplaced.net/de/glaeser/

Wahrscheinlich muss man dem IE sagen, dass er nach dem Ausführen des
JavaScripts das .htc erneut ausführen soll?

Vielleicht wäre das ein Ansatz:

 function bild(n)
{
n = bildNummer(n);
if (n == 0)
{
//blende das startbild ein
}
else {
//for-schleife
}
}

Wenn ich Deinen Ansatz richtig verstehe, dann würde, wenn Bild 0 eingeblendet ist
und Du auf den Pfeil "zum vorhergehenden" klickst, wieder Bild 0 eingeblendet...

Hab da eben auch nochmal rumexperimentiert:
Ich muss es irgendwie schaffen, dass alles bei Null beginnt...

Theoretisch müsste num=(num-1) sein, n=0 und m=0 und diese Zeile müsste
wohl auch anders:

function bildNummer(nr)
{
    return nr > num ? bildNummer(nr-num) : (nr < 1 ? bildNummer(nr+num) : nr);
}

Grüße
Bernhard

 

[neuroleptika]

Hab jetzt mal die Navigation ergänzt, damit man das Problem sieht:
http://www.virtual.bplaced.net/de/glaeser/

Wahrscheinlich muss man dem IE sagen, dass er nach dem Ausführen des
JavaScripts das .htc erneut ausführen soll?

Bernhard,
Ich weiß es nicht.

Schreibe das mal in die ie6.css:

body {
	behavior: url("http://virtual.bplaced.net/csshover3.htc");
}

 

[Bernhard]

Hab jetzt mal die Navigation ergänzt, damit man das Problem sieht:
http://www.virtual.bplaced.net/de/glaeser/

Wahrscheinlich muss man dem IE sagen, dass er nach dem Ausführen des
JavaScripts das .htc erneut ausführen soll?

Bernhard,
Ich weiß es nicht.

Schreibe das mal in die ie6.css:

body {
    behavior: url("http://virtual.bplaced.net/csshover3.htc");
}

Hallo Neuroleptika,

danke für Deine Bemühungen!
Das muss irgendwie anders gehen, so hat es keine Veränderung gebracht...

Grüße
Bernhard

Edit: hab das mit dem "Vorwärts- / Rückwärtsblättern" der Bilder hinbekommen!
Geht zwar wieder bei Bild 1 los, aber das ist mir jetzt erstmal egal (wird vermutlich
zu Problemen führen, wenn ich die Reihenfolge per PHP/MySQL regeln möchte)...

Hab schon kreuz und quer geblättert und keinen Fehler gesehen...

Falls irgendjemandem was auffällt: bitte unbedingt melden!

Jetzt bleiben nur noch zwei Probleme:

• behavior im IE6
• Unterbinden der Anzeige der Galerie während dem Laden

Edit:

Die noscipt.css kann man einfach mit linkRef.disabled = true; ausschalten und display:none; greift.

linkRef.disabled = true;

Wo kommt das hin?

Ich möchte galerie-js.css nach dem Laden des JavaScripts ausschalten, hab nach
linkRef.disabled = true; gegoogelt und vermute, dass es genau das ist, was ich brauche,
hab aber nichts gefunden, wo ich es hinschreibe. Daraufhin hab ich es an zig Stellen probiert,
und entweder eine Fehlermeldung bekommen oder es hat sich gar nichts verändert...;-(

 

[Bernhard]

Hallo @ alle,

sorry für den Doppelpost, aber durch die vielen Edits war mein letzter Beitrag
schon derart unübersichtlich, dass ich ihn nicht nochmal editieren möchte...

Ich möchte galerie-js.css nach dem Laden des JavaScripts ausschalten, hab nach
linkRef.disabled = true; gegoogelt und vermute, dass es genau das ist, was ich brauche,
hab aber nichts gefunden, wo ich es hinschreibe. Daraufhin hab ich es an zig Stellen probiert,
und entweder eine Fehlermeldung bekommen oder es hat sich gar nichts verändert...;-(

Nachdem ich ewig danach gegoogelt habe und keine Lösung gefunden habe,
habe ich jetzt etwas anderes gefunden:

for(var i=0; a = document.getElementsByTagName("link")[i]; i++) {
    if(a.getAttribute("rel").indexOf("style") != -1
    && a.getAttribute("title"))
    a.disabled = true;
    }

Hat noch irgendjemand eine Idee, was ich mit dem behavior-Problem beim IE6 machen kann?

http://www.virtual.bplaced.net/de/glaeser/

Grüße
Bernhard

Edit: hab es geschafft, dass das Blättern bei Bild 0 beginnt!
Da hat eine Zeile im Script gefehlt:

bild(0);

Verstehe zwar nicht, warum die globale Definition der Variablen n=0
zusammen mit

function bild(n)
{
     n = bildNummer(n);
     ...

nicht das gleiche bewirkt, ist aber offenbar so...

Zum behavior-Problem im IE 6: Ich vermute, dass ich am Ende des JavaScripts
irgendwas schreiben muss, dass nun das .htc wieder ausgeführt werden soll.

Kann mir da bitte jemand einen Tipp geben?

 

[neuroleptika]

Wenn du selector:hover nur für das Ausklapmenü brauchst könntest du auch das Kleine Skript von Patrick Griffiths verwenden.
A List Apart: Articles: Suckerfish Dropdowns
Die Klasse li.over müßtest du dann von Hand in die css-Datei einfügen.

 

[Bernhard]

Problem gelöst => völlig anderer Weg!

Wenn du selector:hover nur für das Ausklapmenü brauchst könntest du auch das Kleine Skript von Patrick Griffiths verwenden.
A List Apart: Articles: Suckerfish Dropdowns
Die Klasse li.over müßtest du dann von Hand in die css-Datei einfügen.

Hallo Neuroleptika,
hallo @ alle,

danke für die Hilfe! Danke auch für die Mail mit dem Link!

Hab jetzt einen völlig anderen Weg gefunden, der zu funktionieren scheint!
http://www.virtual.bplaced.net/de/glaeser/
Der ganze Trick ist hier:
http://www.virtual.bplaced.net/includes/ie6.css

(.sub-1st und .sub-last brauche ich, da die beim :hover andere Hintergrundbilder bekommen)

Kann mir jemand sagen, wie weit das abwärtskompatibel ist?
Ich vermute mal, bis IE5.0?

Jetzt muss ich es noch in die Original-Datei einbauen und etwas aufräumen, da
durch die Rumexperimentierei mit Sicherheit das ein oder andere zuviel drin ist...

Grüße
Bernhard

 

[neuroleptika]

Hi Bernhard,
das Ausklappmenü funktioniert jetzt auch im IE5.x.

Das übrige Script funktioniert aber erst ab Vers.6.
(Die Elemente werden nicht eingeblendet).

 

[Bernhard]

Hi Bernhard,
das Ausklappmenü funktioniert jetzt auch im IE5.x.

Das übrige Script funktioniert aber erst ab Vers.6.
(Die Elemente werden nicht eingeblendet).

Hallo Neuroleptika,

Du meinst das Galerie-Script? - D.h. die Galerie ist unbenutzbar?
Dann schaue ich, dass ich denen vor Version 6 einfach das CSS
für ie6 ohne JavaScript liefere, damit müssen die Leute leben...

Ich schau mir das nochmal bei Browsershots an.

Grüße
Bernhard

 

[neuroleptika]

Du meinst das Galerie-Script? - D.h. die Galerie ist unbenutzbar?
Dann schaue ich, dass ich denen vor Version 6 einfach das CSS
für ie6 ohne JavaScript liefere, damit müssen die Leute leben...

Ja,
das Galerie-Script ist im IE5 und 5.5 unbenutzbar.

------------------------------------
.content rutscht im IE5.x unter #navi.
Schreibe das mal in deine ie6.css oder ie7.css
(werden beide vom IE5-7 gelesen):

* html .content {
float[COLOR="DarkRed"][B] /**/[/B][/COLOR]:none;
}

Leerzeichen zwischen float und /**/ nicht vergessen !
In dieser Schreibweise wird es nur vom IE5.x berücksichtigt.

 

[Bernhard]

Ja,
das Galerie-Script ist im IE5 und 5.5 unbenutzbar.

------------------------------------
.content rutscht im IE5.x unter #navi.
Schreibe das mal in deine ie6.css oder ie7.css
(werden beide vom IE5-7 gelesen):

* html .content {
float[COLOR=DarkRed][B] /**/[/B][/COLOR]:none;
}

Leerzeichen zwischen float und /**/ nicht vergessen !
In dieser Schreibweise wird es nur vom IE5.x berücksichtigt.

Hallo Neuroleptika,

ich würde mir das am liebsten life anschauen, auch wenn ich der Meinung bin,
dass es genügt, IEs vor 6 nur ganz rudimentär zu bedienen...

Mit float:none; würde der Inhalt unter die Navigation rutschen (also nicht von
ihr verdeckt werden, sondern man müsste vertikal scrollen, um ihn zu erreichen)
=> falls dann noch JavaScript deaktiviert ist, müsste man sehr weit scrollen, bis
man was sieht (weil dann alle Unternavigationspunkte angezeigt werden)

Da ich keinen IE älter als 6 habe, die Frage:

• kann ich mir das selbst anschauen, wenn ich den IE6 in den Quirks-Modus
  versetze?
• sieht das auf IE5.5 Mac genauso aus? (da könnte ich es mir bei einem
  Bekannten anschauen)

Grüße
Bernhard

P.S.: (ich vermute, dass es Dich interessiert...) ich hatte Dir auf Deine Mail
geantwortet, dass Dein Vorschlag nur für die erste Ebene funktioniert, nicht
für die zweite - ich hatte versucht, Dein Script direkt in der original-Version
der Website umzusetzen... - meine Idee habe ich zuerst in der abgespeckten
Version getestet, die ich hier verlinkt habe - als ich sie jetzt in die original-
Version kopiert habe, hat sie auch nur für die erste Ebene funktioniert...
Lösung: die Test-Version enthält keine background-images, die Funktion wird
initialisiert durch background-image, in der original-Version wimmelt es vor
background-images, nachdem ich in der ie6.css background-image durch
background-attachment ersetzt habe, hat es hingehauen...
Hast Du dafür eine Erklärung?

 

[neuroleptika]

• kann ich mir das selbst anschauen, wenn ich den IE6 in den Quirks-Modus
  versetze?
• sieht das auf IE5.5 Mac genauso aus? (da könnte ich es mir bei einem
  Bekannten anschauen)

Ich habe im IE8 > Extras > Entwicklertools
den Browsermodus auf IE7 und Dokumentenmodus auf Quirks gestellt.
Die Seite sah dann so aus wie im IE5.5-win.
Dann habe ich das Element div.content angewählt und dort das Häckchen bei float: left entfernt.
.content rutschte so nicht mehr unter #navi.

Wenn es um Boxmodellfehler oder Floats im IE5.5 geht, liege ich damit meißtens richtig (aber nicht immer).

Mit dem IE-mac hat das alles nichts gemein.
Er kennt weder haslayout noch Conditional Comments.
Meine Quelle für den IE-mac ist versiegt.
(fh-Hannover, die Fachbereiche bildende / freie Kunst gibt es nicht mehr).
Ich beachte diesen Browser nicht mehr.

.. nachdem ich in der ie6.css background-image durch
background-attachment ersetzt habe, hat es hingehauen...
Hast Du dafür eine Erklärung?

Nein,
ich habe derzeit kein Debugging-Werkzeug für den IE6 und darunter.

Ich verwende diese Emulation unter Linux:
http://www.tatanka.com.br/ies4linux/page/Main_Page