/* ************************************************************************** */ /* Datei JavaScript-Bildanpassungs-Funktionen.js */ /* */ /* JavaScript-Funktionen Status: 27.06.2009/09.12.2009 */ /* zur Manipulation von Bildern im HTML: */ /* Anpassung der Bildgroesse an die Bildschirmgroesse */ /* Es wird davon ausgegangen, dass die Bilder an einen Bilschirm mit */ /* 768x1024 (HoehexBreite) angepasst sind */ /* */ /* Author: Gerhard Mueller, GmuSoft, www.gmusoft.de */ /* Copyright: Entsprechend der GNU General Public License (GPL), */ /* siehe http://www.gnu.org/licenses/gpl.html */ /* oder http://www.gnu.de/gpl-ger.html, */ /* siehe auch GNU Free Documentation License (GFDL), */ /* http://www.gnu.org/copyleft/fdl.html oder */ /* http://www.giese-online.de/gnufdl-de.html */ /* Bestimmte Personen sind jedoch von der freien Nutzung ausgeschlossen, */ /* siehe http://www.mueller-herrenberg/license.htm */ /* ************************************************************************** */ /* ************************************************************************** */ /* Benutzte Funktionen muessen vorher definiert sein: Nein */ /* */ /* Vor Ausdruecken wie document.xxx darf kein document.write() benutzt werden,*/ /* sonst gibt es beim Internet Explorer Fehler (Bezug auf neues document) */ /* */ /* ************************************************************************** */ // Lokale und globale Variable: // Ausserhalb einer Funktion definiert: Global // Innerhalb einer Funktion definiert mit var: lokal // Innerhalb einer Funktion definiert ohne var: global // Parameter einer Funktion: lokal // Funktions-Aufrufe koennen eine andere Zahl von Parametern haben wie die Funktions-Definition // Comments: // bis Ende der Zeile oder /* ... */ function adapt_graphics_x ( opt_schirm_breite, rand_breite ) { Betriebssystem = navigator.platform; // Betriebssystem - Operating system Browser_Name = navigator.appName; // Name des Browsers Browser_Spitzname = navigator.appCodeName; // Spitzname des Browsers - nickname Browser_Version = navigator.appVersion; // Version des Browsers Browser_HTTP_Id = navigator.userAgent; // HTTP-Identifikation des Browsers // alert ( "Betriebssystem: " + Betriebssystem + " Browser_Name: " + Browser_Name + " Browser_Spitzname: " + Browser_Spitzname + " Browser_Version: " + Browser_Version + " Browser_HTTP_Id: " + Browser_HTTP_Id ); // Bei Firefox: Betriebssystem: Win32 Browser_Name: Netscape Browser_Spitzname: Mozilla Browser_Version: 5.0 (Windows; de) Browser_HTTP_Id: Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.9.0.11) Gecko/2009060215 Firefox/3.0.11 (.NET CLR 3.5.30729) // Bei Internet Explorer nicht kopierbar, aber Browser_Name: Microsoft Internet Explorer Browser_Spitzname: Mozilla ... // Bei Opera: Betriebssystem: Win32 Browser_Name: Opera Browser_Spitzname: Mozilla Browser_Version: 9.51 (Windows NT 5.1; U; de) Browser_HTTP_Id: Opera/9.51 (Windows NT 5.1; U; de) // Bei Konqueror: Browser_Name: Konqueror if ( Browser_Name == "Netscape" ) // Mit Firefox 3.0.11 funktioniert das (noch) nicht sicher - Bug 500997 { // window.setTimeout("adapt_graphics2 (" + opt_schirm_breite + "," + rand_breite + " )", 1000); // Delay 1000 milliseconds - 500 ms reichten beim Testcase und meinen Tests (2.7.2009). Bei Ilse reichte es (bei Firefox) einmal bei einem Bild nicht (3.7.2009) window.setTimeout("adapt_graphics2 (" + opt_schirm_breite + "," + rand_breite + " )", 2000); // Delay 2000 milliseconds return 0; } // adapt_graphics2 ( opt_schirm_breite, rand_breite ); // Mit allen anderen Browsern funktioniert das auch nicht zuverlaessig: // Am 1.7.2009 schien es, als gaebe es das Problem nur bei Firefox, am 2.7.2009 ergab sich, dass auch die anderen Browser das Problem haben, teilweise sogar heftiger window.setTimeout("adapt_graphics2 (" + opt_schirm_breite + "," + rand_breite + " )", 2000); // Delay 2000 milliseconds return 0; } function adapt_graphics ( opt_schirm_breite, rand_breite ) // Die Groesse von Grafiken (Bildern) an die Bildschirmgroesse anpassen // Annahme: Die Bilder sind fuer einen Bildschirm mit Breite 1024 Pixel und Hoehe 768 Pixel (1024x768) angepasst // (Breite : Hoehe = 4 : 3) // Sie werden proportional zur vorhandenen Bildschirmbreite vergroessert oder verkleinert // opt_schirm_breite = Bildschirmbreite, fuer die die Bilder erstellt bzw. optimiert wurden // rand_breite = Rand, der von der Bildschirmbreite abgeht und fuer etwas anderes benutzt wird // Wenn die Randbreite sich mit aendert, sollte sie als "0" angegeben werden. { if (typeof(opt_schirm_breite) == "undefined") { // alert ("opt_schirm_breite undefined"); var opt_schirm_breite = 1024; } else { // alert ("opt_schirm_breite: " + opt_schirm_breite); if (typeof(opt_schirm_breite) != "number") { var opt_schirm_breite = 1024; } } if (typeof(rand_breite) == "undefined") { //alert ("rand_breite undefined"); var rand_breite = 100; } else { // alert ("rand_breite: " + rand_breite); if (typeof(rand_breite) != "number") { var rand_breite = 100; } } // alert ("opt_schirm_breite: " + opt_schirm_breite + " - rand_breite: " + rand_breite); var nutzbreite_vorher = opt_schirm_breite - rand_breite; Betriebssystem = navigator.platform; // Betriebssystem - Operating system Browser_Name = navigator.appName; // Name des Browsers Browser_Spitzname = navigator.appCodeName; // Spitzname des Browsers - nickname Browser_Version = navigator.appVersion; // Version des Browsers Browser_HTTP_Id = navigator.userAgent; // HTTP-Identifikation des Browsers // alert ( "Betriebssystem: " + Betriebssystem + " Browser_Name: " + Browser_Name + " Browser_Spitzname: " + Browser_Spitzname + " Browser_Version: " + Browser_Version + " Browser_HTTP_Id: " + Browser_HTTP_Id ); // Bei Firefox: Betriebssystem: Win32 Browser_Name: Netscape Browser_Spitzname: Mozilla Browser_Version: 5.0 (Windows; de) Browser_HTTP_Id: Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.9.0.11) Gecko/2009060215 Firefox/3.0.11 (.NET CLR 3.5.30729) // Bei Internet Explorer nicht kopierbar, aber Browser_Name: Microsoft Internet Explorer Browser_Spitzname: Mozilla ... // Bei Opera: Betriebssystem: Win32 Browser_Name: Opera Browser_Spitzname: Mozilla Browser_Version: 9.51 (Windows NT 5.1; U; de) Browser_HTTP_Id: Opera/9.51 (Windows NT 5.1; U; de) // Bei Konqueror: Browser_Name: Konqueror Bildschirm_Breite_total = screen.width; // Vorhandene Bildschirmbreite - bei meinem Bildschirm 1024 (XP) bzw. 1280 (Suse) Bildschirm_Hoehe_total = screen.height; // Vorhandene Bildschirmhoehe - bei meinem Bildschirm 768 (XP) bzw. 1024 (Suse) Bildschirm_Breite = screen.availWidth; // Vorhandene verfuegbare Bildschirmbreite - bei meinem Bildschirm 1024 (XP) Bildschirm_Hoehe = screen.availHeight; // Vorhandene verfuegbare Bildschirmhoehe - bei meinem Bildschirm 738 (XP) // alert ("Bildschirm_Breite: " + Bildschirm_Breite + " - Bildschirm_Hoehe: " + Bildschirm_Hoehe); // Fuer Test: // Bildschirm_Breite = 800; // Fuer den Test angenommene Bildschirmbreite Fenster_Breite_total = window.outerWidth; // Vorhandene Fensterbreite Fenster_Hoehe_total = window.outerHeight; // Vorhandene Fensterhoehe Fenster_Breite = window.innerWidth; // Vorhandene verfuegbare Fensterbreite - bei Firefox 3.0.11 (vermutlich) richtige Werte, bei Internet Explorer 8 "undefined" - bei mir maximiertes Fenster (XP): 1024 Fenster_Hoehe = window.innerHeight; // Vorhandene verfuegbare Fensterhoehe - bei Firefox 3.0.11 (vermutlich) richtige Werte, bei Internet Explorer 8 "undefined" - bei mir maximiertes Fenster (XP): 602 // alert ("Fenster_Breite: " + Fenster_Breite + " - Fenster_Hoehe: " + Fenster_Hoehe); // Fuer Test: // Fenster_Breite = 800; // Fuer den Test angenommene Fensterbreite var Bereich_Breite = Bildschirm_Breite; // Wenn nicht 3:4-Format (Hoehe : Breite): if ( (Bildschirm_Hoehe_total < (Bildschirm_Breite_total * 0.75)) && (Bildschirm_Hoehe_total > (opt_schirm_breite * 0.75)) ) // 0.75 = 3/4 { Bereich_Breite = Bildschirm_Hoehe_total / 0.75; } if (Bereich_Breite == opt_schirm_breite) // Wenn keine Anpassung vorzunehmen ist, ... {return 0;} var nutzbreite_nachher = Bereich_Breite - rand_breite; vergroesserung = nutzbreite_nachher / nutzbreite_vorher; // vergroesserung muss global sein wegen Aufspaltung in mehrere Funktionen var vergroesserung_max = 1.5; hoehe_max = Bildschirm_Hoehe - 100; // Gilt nur bei Vergroesserung - muss global sein wegen Aufspaltung in mehrere Funktionen if (vergroesserung > vergroesserung_max) { vergroesserung = vergroesserung_max; } // Zeige Bildschirmgroesse, auf die angepasst wurde, auf der Webseite var neuertext = "Angepasst an Bildschirmgroesse " + Bildschirm_Breite_total + " x " + Bildschirm_Hoehe_total + " (verfuegbar: " + Bildschirm_Breite + " x " + Bildschirm_Hoehe + ")"; // ******************************************************************* // if ( Browser_Name == "Netscape" ) // Mit Firefox 3.0.11 funktioniert die Anpassung (noch) nicht // { // neuertext = "Anpassung an Bildschirmgroesse " + Bildschirm_Breite_total + " x " + Bildschirm_Hoehe_total + " (verfuegbar: " + Bildschirm_Breite + " x " + Bildschirm_Hoehe + ") war nicht moeglich"; // } // ******************************************************************* // Der FONT muss ausserhalb des SPAN sein, sonst ist der Text nicht mehr "firstChild" if (typeof(document.getElementsByName("Schirmanpassungsfont")[0]) == "object") { var Elementknoten = document.getElementsByName("Schirmanpassungsfont")[0]; Elementknoten.color = "green"; // Die Farbaenderung funktioniert mit Firefox 3.05, mit Internet Explorer 7.0 und 8.0 nur, wenn auch die "id" auf den gleichen Wert gesetzt ist } if (typeof(document.getElementsByName("Schirmanpassung")[0]) == "object") { var Elementknoten = document.getElementsByName("Schirmanpassung")[0]; Elementknoten.firstChild.nodeValue = neuertext; // Die Textaenderung funktioniert mit Firefox 3.05, mit Internet Explorer 7.0 und 8.0 nur, wenn auch die "id" auf den gleichen Wert gesetzt ist } // ******************************************************************* // if ( Browser_Name == "Netscape" ) // Mit Firefox 3.0.11 funktioniert das (noch) nicht sicher - Bug 500997 // {return 1;} // ******************************************************************* // Werte fuer Delay zwischen Versuchen und maximaler Wartezeit: // Fuer den Download von 100 kB wird bei voller Leitungsgeschwindigkeit gebraucht: // Analoge Telefonleitung mit (aelterem) Modem 14400 bps: 56 sec (die ganz frühen Modems waren noch langsamer) // Analoge Telefonleitung mit neuem (Status 2009) Modem 56 kbit/s: 15 sec // ISDN mit 64 kbit/s: 13 sec // DSL mit 1000 kbit/s: 800 ms // DSL mit 16000 kbit/s: 50 ms // Dateigroesse pro Bild (im Mittel, geschaetzt): small(300x200): 12 kB, large(650x1000): 70 kB // im Gesamt-Mittel vermutlich unter 50 kB // Damit geschaetzte Groesse aller Bild-Dateien zusammen: 50 kb * Zahl der Bilder: var bilderzahl = document.images.length; var daten_menge = bilderzahl * (50/100); // in Einheiten von 100 kB var daten_time = daten_menge * 800; // Millisekunden fuer DSL-1000, mehr als das 10fache fuer ISDN und das 100fache fuer alte Analog-Modems // d.h. 400 ms pro Bild (50kB) bei DSL-1000, 1/10tel davon fuer schnelles DSL (DSL-16000) // delay = 200; // in Millisekunden // max_wait = 5000; // in Millisekunden // max_wait = Math.ceil(daten_time); // fuer DSL-1000 max_wait = Math.ceil(Math.min(Math.max(daten_time, 1000), 50000)); // daten_time, aber mindestens 1 sec und hoechstens 5 sec var slices = Math.min(Math.max(bilderzahl, 5), 20); // bilderzahl, aber mindestens 5 und hoechstens 20 delay = Math.ceil(max_wait/slices); // Ergibt min 200 ms, max 400 (Zeit fuer 1 Bild), bei vielen Bildern 250 // alert("delay: " + delay + " max_wait: " + max_wait); // Ergibt fuer den Menschen brauchbare Werte (bei DSL-1000) - bei Telefonleitungen kann (bei weitem) nicht lange genug gewartet werden // Hole alle Images: // Initialisierung fuer Rekursion if (typeof(bild_anzahl) == "undefined") { bild_anzahl = document.images.length; // Anzahl der Grafiken (Images) im Dokument // alert ("anzahl: " + bild_anzahl); // Bei Referenzen beginnen die Nummern der Grafiken mit 0, length zaehlt normal (beginnt mit 1) bild_bearbeitet = new Array (bild_anzahl); // array zur Anzeige, welche Bilder bereits bearbeitet wurden for (var j = 0; j < bild_bearbeitet.length; j++) // array initialisieren {bild_bearbeitet[j] = false;} bild_anzahl_bearbeitet = 0; // Zahl der Bilder, die schon bearbeitet wurden. wait_time = 0; // To keep track waiting times through setTimeout } // do_adapt (); do_adapt1 (); // Bei do_adapt(): // alert ("bild_anzahl_bearbeitet: " + bild_anzahl_bearbeitet + " wait_time: " + wait_time + " bild_bearbeitet: " + bild_bearbeitet); // IE antwortet immer mit 0, 2000, false, ... und vergroessert anschliessend (bei wait<2000) - kann eigentlich gar nicht sein // Das passiert offenbar dadurch, dass mit setTimeout ein separater Thread gestartet wird und der alte weiterlaeuft. // Firefox 3.0.11 und Opera 9.51 zeigen zuerst die alerts hinter if complete == true (wenn eingeschaltet), dann diese Message // Bei IE 8.0 ist es umgekehrt } // Die folgende Funktion wirkt nur bei sequentieller Abarbeitung, // d.h. wenn die mit delay aufgerufene Funktion zur Instruktion nach dem Aufruf zurückkehrt // und diese erst dann weiterlaeuft function do_adapt () // Warte, bis Bilder geladen sind und passe sie dann an, aber begrenze die Gesamt-Wartezeit { try_adapt (); while ( (bild_anzahl_bearbeitet < bild_anzahl) && (wait_time < 5000) ) // Wait for a maximum of 5000 milliseconds { var delay = 200; // delay 200 milliseconds each time wait_time = wait_time + delay; // window.setTimeout("do_adapt ()", delay); // Wait for "delay" milliseconds before repeating - recursion window.setTimeout("try_adapt ()", delay); // Wait for "delay" milliseconds before repeating // the delayed function runs in a separate execution context // Zumindest beim IE werden alle setTimeouts zum gleichen Zeitpunkt abgesetzt, dann wird fortgefahren // Es wird also insgesamt effektiv nur eine delay-Einheit gewartet !!! } return 0; } // Die folgenden Funktionen erzwingen, dass der naechste delay erst nach Ablauf des vorherigen beginnt. // Sie funktionieren sowohl bei sequentieller als auch bei paralleler Abarbeitung, // mit Ausnahme dessen, was danach kommt, z.B. der Message am Ende // und es könnte, wenn die Abarbeitung eines Threads nicht vor dem Start des naechsten beendet ist, // eine Race-Condition bei der Veränderung der globalen Variablen kommen. function do_adapt1 () // Warte, bis Bilder geladen sind und passe sie dann an, aber begrenze die Gesamt-Wartezeit { try_adapt (); if ( (bild_anzahl_bearbeitet < bild_anzahl) && (wait_time < max_wait) ) // Wait for a maximum of xxx milliseconds { // var delay = 200; // delay 200 milliseconds each time // delay und max-wait sind jetzt globale variable wait_time = wait_time + delay; window.setTimeout("do_adapt2 ()", delay); // Wait for "delay" milliseconds before starting the indicated function // the delayed function runs in a separate execution context } // if ( (bild_anzahl_bearbeitet >= bild_anzahl) || (wait_time >= max_wait) ) // completed else { // alert ("bild_anzahl_bearbeitet: " + bild_anzahl_bearbeitet + " wait_time: " + wait_time + " bild_bearbeitet: " + bild_bearbeitet); } return 0; } function do_adapt2 () // Warte, bis Bilder geladen sind und passe sie dann an, aber begrenze die Gesamt-Wartezeit { try_adapt (); if ( (bild_anzahl_bearbeitet < bild_anzahl) && (wait_time < max_wait) ) // Wait for a maximum of xxx milliseconds { wait_time = wait_time + delay; window.setTimeout("do_adapt1 ()", delay); // Wait for "delay" milliseconds before starting the indicated function // the delayed function runs in a separate execution context } // if ( (bild_anzahl_bearbeitet >= bild_anzahl) || (wait_time >= max_wait) ) // completed else { // alert ("bild_anzahl_bearbeitet: " + bild_anzahl_bearbeitet + " wait_time: " + wait_time + " bild_bearbeitet: " + bild_bearbeitet); } return 0; } function try_adapt () // Passe die Bilder an, die schon geladen und noch nicht bearbeitet sind { // for ( Schleifenzaehler-Initialisierung ; Bedingung ; Schleifenzaehler-Aenderung nach Durchlauf ) var bildhoehe_i, neuehoehe_i, vergroesserung_i, bilddatei_i; for ( var i=0 ; i < bild_anzahl ; i++) // Der Index i ist ja um 1 kleiner als die normal gezaehlte Element-Nummer, daher Test auf "kleiner" statt "kleiner gleich" { // alert (i + " bildname: " + document.images[i].name + " bildid: " + document.images[i].id + " class= " + document.images[i].class); // class gibt immer undefined // alert (i + " bildname: " + document.images[i].name + " bildid: " + document.images[i].id + " class= " + document.images[i].className); // if ( document.images[i].complete == true) // Nicht noetig fuer Internet Explorer, notwendig fuer Firefox 3.0.11 ? - Nein, fuer alle // aber wenn Bild nicht existiert, bleibt IE bei false, Firefox gibt true (offenbar, sobald das bekannt ist) // IE zeigt dann height als 30, Firefox als 16, width offenbar abhaengig vom alt-Text, height koennte auch von Schriftgroesse abhaengig sein. if ( (document.images[i].complete == true) && (bild_bearbeitet[i] != true) ) // Wenn das Bild fertig geladen und noch nicht bearbeitet ist { vergroesserung_i = vergroesserung; bildhoehe_i = document.images[i].height; neuehoehe_i = bildhoehe_i * vergroesserung; if ((neuehoehe_i > hoehe_max) && (vergroesserung > 1)) { vergroesserung_i = hoehe_max / bildhoehe_i; } // Ggf. individuell geringere Vergroesserung // bilddatei_i = document.images[i].src; // alert (i + " bildname: " + document.images[i].name + " bildid: " + document.images[i].id + " vergroesserung: " + vergroesserung); // bild_adapt( document.images[i], 1 ); // Vergroessere (verkleinere) Bild Nummer i // bringt nichts Neues bild_adapt( document.images[i], vergroesserung_i ); // Vergroessere (verkleinere) Bild Nummer i bild_bearbeitet[i] = true; // Zeige an, dass Bild bearbeitet wurde bild_anzahl_bearbeitet = bild_anzahl_bearbeitet + 1; // Erhoehe Anzahl der bearbeiteten Bilder } else { // alert (i + " bildname: " + document.images[i].name + " bildid: " + document.images[i].id + " noch nicht geladen"); // Erscheint bei Firefox nur beim ersten Bild, bei Internet Explorer bei jedem. // bild_adapt( document.images[i], vergroesserung_i ); // Vergroessere (verkleinere) Bild Nummer i } } } function bild_adapt (bild, zoomfaktor) // Ein Bild einschliesslich image map vergroessern oder verkleinern { // bild = graphics object // zoomfaktor = number // alert("zoom: " + bild + " " + zoomfaktor ); // var altebreite = bild.width; // var altehoehe = bild.height; // bild.width = altebreite; // bild.height = altehoehe; var altebreite = bild.width; var altehoehe = bild.height; if ((typeof(altebreite) == "number") && (typeof(altehoehe) == "number")) { var neuebreite = Math.ceil(eval(altebreite * zoomfaktor)); var neuehoehe = Math.ceil(eval(altehoehe * zoomfaktor)); } else { // alert ("Breite und Hoehe nicht numerisch"); // Alert erfolgt nicht var neuebreite = altebreite; // dann kann (bisher) nicht angepasst werden var neuehoehe = altehoehe; } // alert ("bildname: " + bild.name + " bildid: " + bild.id + " Alte Breite und Hoehe: " + altebreite + "x" + altehoehe + " - Neue Breite und Hoehe: " + neuebreite + "x" + neuehoehe); // bild.width = neuebreite; // bild.height = neuehoehe; // Funktioniert bei Firefox 3.0.11 meist erst nach "Aktualisieren, // beim ersten Laden, wenn Firefox gleich mit der Datei aufgerufen wird, ist Hoehe minimal // Das Problem tritt immer dann auf, wenn die Bilddateien noch nicht in der aktuellen Sitzung von Firefox geladen (aufgerufen) wurden // Bei allen noch nicht vorher in der Sitzung geladenen Bilddateien, bei anderen nicht, sowohl lokal als auch über Internet if (altebreite != 0) // Bei manchen aelteren Browsern, z.B. Netscape 6.1 und Konqueror 3.1, ist anfangs 0 gespeichert, wenn "width" im HTML nicht angegeben ist {bild.width = neuebreite;} // Hat bei allen Browsern (IE, Firefox, Opera, Konqueror) korrekte Werte (Status 6/2009) if (altehoehe != 0) // Bei manchen aelteren Browsern, z.B. Netscape 6.1 und Konqueror 3.1, ist anfangs 0 gespeichert, wenn "height" im HTML nicht angegeben ist {bild.height = neuehoehe;} // Bringt keine Aenderung bilddatei = bild.src; // Ergibt den Namen der Bilddatei einschl. Pfad. // alert (bild.src); usemap = bild.useMap; // ergibt eine Character-Variable mit # vorweg if (usemap.length <= 1) {return 0} usemap = usemap.substr(1,usemap.length); if (typeof(document.getElementsByName(usemap)[0]) == "object") { var i = 0; var altekoordinaten, neuekoordinaten; for ( i=0; i 4) ) { change_picture_size_part2 (bildname); } else { i = i + 1; wait_time = wait_time + delay; // window.setTimeout("wait_for_load (" + bildname + ")", delay); // Wait for "delay" milliseconds before starting the indicated function // Firefox 3.5 mosert hier: "Flinke is not defined" (Flinke ist der erste Teil des Bildnamens "Flinke-Pfotem-Logo") // Der Code hier entspricht einem Coding-Beispiel bei Microsoft (http://msdn.microsoft.com/en-us/library/ms536753(VS.85).aspx) // Dort wird aber auch gesagt, dass man beim Internet Explorer der "Callback"-Funktion keine Parameter mitgeben kann // Id = window.setTimeout(function(){wait_for_load(bildname);}, delay); // Wait for "delay" milliseconds before starting the indicated function // So entspricht es dem Coding-Beispiel bei Microsoft mit einer anonymen Closure-Funktion (http://msdn.microsoft.com/en-us/library/ms536749(VS.85).aspx) // Aus einem SelfHTML-Forum: Wichtig ist, dass die Zeichenkette, die als erster Parameter an setTimeout übergeben wird, interpretiert wiederum gültiges JavaScript ergibt. // Demnach muesste also auch gehen: // Id = window.setTimeout('wait_for_load ("' + bildname + '")', delay); // Wait for "delay" milliseconds before starting the indicated function // Nach dem Ende des Delay wird offenbar einfach eval(string) aufgerufen var bild = document.getElementsByName(bildname)[0]; // Id = window.setTimeout( test_timeout (bildname, bild) , delay); // Firefox: Fehler: useless setTimeout call (missing quotes around argument?) // Aber Parameter werden korrekt weitergegeben // Bei IE werden Parameter auch korrekt weitergegeben, aber IE kommt nicht mehr aus der Loop heraus // Das i wird hochgezaehlt, aber das (i > 4) wird nicht oder falsch interpretiert // Id = window.setTimeout( 'test_timeout (bildname, bild)' , delay); // Firefox: Fehler: bildname is not defined // Bei Firefox und IE wird die Funktion (offenbar) abgebrochen // Id = window.setTimeout( 'test_timeout ("' + bildname + '", "' + bild + '")' , delay); // FirefoX: bildname kommt korrekt rueber (weil es ein Zeichenstring ist), aber bild wird in Zeichenstring verwandelt und kommt nicht als Objekt rueber // IE genauso // Parameter passing "by value" // Id = window.setTimeout( function() {test_timeout (bildname, bild)} , delay); // Firefox und IE: Beide Parameter kommen korrekt (als Objekte) rueber // Id = window.setTimeout( function() {test_timeout (bildname, bild);} , delay); // Firefox und IE: Beide Parameter kommen korrekt (als Objekte) rueber // Parameter passing "by reference" // Id = window.setTimeout( 'function() {test_timeout (bildname, bild);}' , delay); // Firefox: Syntax error // Wird bei Firefox und IE nicht ausgefuehrt // Id = window.setTimeout( 'function xxx() {test_timeout (bildname, bild);}' , delay); // Firefox und IE: Wird nicht ausgefuehrt Id = window.setTimeout( function xxx() {test_timeout (bildname, bild);} , delay); // Firefox und IE: Wird korrekt ausgefuehrt } } function test_timeout (bildname, bild) { alert ("i=" + i + " Bildname: " + bildname + " Bild (Objekt): " + bild + " bild.width: " + bild.width); wait_for_load (bildname); } function change_picture_size_2_part2 (bildname) // Das Bild existiert jetzt und ist geladen { // Aktuelle Bildgroesse: var Bildknoten = document.getElementsByName(bildname)[0]; var curr_width = Bildknoten.width; var curr_height = Bildknoten.height; // alert ("Bild " + bildname + ": Bild_Breite: " + curr_width + " - Bild_Hoehe: " + curr_height); // Nutzbare Breite und Hoehe // if (typeof(Nutzbare_Breite) == "undefined") { } // Nein, weil ggf. nach jeder Fensteraenderung neu berechnet werden soll get_window_width_height(); // Das Resultat ist nutzbare Breite und Hoehe W = Nutzbare_Breite; // für die Formel H = Nutzbare_Hoehe; // für die Formel Max_width = eval(Width_Formel); // Das funktioniert mit globalen Variablen Max_height = eval(Height_Formel); // Aber wohl nur, weil hier im Testfall nur EIN Bild bearbeitet wird // eval('Max_width = ' + Width_Formel); // eval('Max_height = ' + Height_Formel); // Neue Bildgroesse: var possible_width_enlargement = Max_width / curr_width; var possible_height_enlargement = Max_height / curr_height; var enlargement = Math.min (possible_width_enlargement, possible_height_enlargement); bild_adapt (Bildknoten, enlargement); var new_width = Bildknoten.width; var new_height = Bildknoten.height; alert ("Bild " + bildname + ": Neue Bild_Breite: " + new_width + " - Neue Bild_Hoehe: " + new_height); } function change_picture_size_part2 (bildname, Width_Formel, Height_Formel) // Das Bild existiert jetzt und ist geladen { // Aktuelle Bildgroesse: var Bildknoten = document.getElementsByName(bildname)[0]; var curr_width = Bildknoten.width; // Achtung: Abhaengigkeit von den Definitionen in change_picture_size var curr_height = Bildknoten.height; // Achtung: Abhaengigkeit von den Definitionen in change_picture_size // alert ("Bild " + bildname + ": Bild_Breite: " + curr_width + " - Bild_Hoehe: " + curr_height); // Nutzbare Breite und Hoehe // if (typeof(Nutzbare_Breite) == "undefined") { } // Nein, weil ggf. nach jeder Fensteraenderung neu berechnet werden soll get_window_width_height(); // Das Resultat ist nutzbare Breite und Hoehe var W = Nutzbare_Breite; // für die Formel // Geht mit globalen Variablen evtl. nur, var H = Nutzbare_Hoehe; // für die Formel // wenn nur ein Fenster zur Zeit diese Funktions-Datei benutzt var Max_width = eval(Width_Formel); var Max_height = eval(Height_Formel); // eval('Max_width = ' + Width_Formel); // eval('Max_height = ' + Height_Formel); // Neue Bildgroesse: var possible_width_enlargement = Max_width / curr_width; var possible_height_enlargement = Max_height / curr_height; var enlargement = Math.min (possible_width_enlargement, possible_height_enlargement); bild_adapt (Bildknoten, enlargement); var new_width = Bildknoten.width; var new_height = Bildknoten.height; // alert ("Bild " + bildname + ": Neue Bild_Breite: " + new_width + " - Neue Bild_Hoehe: " + new_height); } function change_table_size_1 (table_id, w_formel, h_formel) // Die Groesse einer Tabelle oder eines Tabellenteils an die Fenstergroesse bzw. Bildschirmgroesse anpassen // table_id = Id (nicht Name) der Tabelle, einer Zeile oder einer Zelle // w_formel = Formel zur Berechnung der Breite, dabei ist"W" die (innere) Fensterbreite , "-" = nichts machen // h_formel = Formel zur Berechnung der Hoehe, dabei ist"H" die (innere) Fensterhoehe , "-" = nichts machen { if (typeof(document.getElementById(table_id)) == "object") { // Firefox mosert manchmal, dass der Elementknoten null ist - Keine Ahnung, wie das nach dieser Abfrage vorkommen kann // Aktuelle Groesse: var Elementknoten = document.getElementById(table_id); // alert ("Ereignis: " + Ereignis + " Tabellen-Element " + table_id + ": Elementknoten: " + Elementknoten); var curr_width = Elementknoten.width; var curr_height = Elementknoten.height; // alert ("Tabellen-Element " + table_id + ": Breite: " + curr_width + " - Hoehe: " + curr_height); // Nutzbare Breite und Hoehe // if (typeof(Nutzbare_Breite) == "undefined") { } // Nein, weil ggf. nach jeder Fensteraenderung neu berechnet werden soll get_window_width_height(); // Das Resultat ist nutzbare Breite und Hoehe W = Nutzbare_Breite; // für die Formel H = Nutzbare_Hoehe; // für die Formel if (typeof(w_formel) != "undefined") { if (w_formel != "-") { Elementknoten.width = Math.ceil(eval(w_formel)); } } if (typeof(h_formel) != "undefined") { if (h_formel != "-") { Elementknoten.height = Math.ceil(eval(h_formel)); } } var new_width = Elementknoten.width; var new_height = Elementknoten.height; // alert ("Tabellen-Element " + table_id + ": Neue Breite: " + new_width + " - Neue Hoehe: " + new_height); } } function change_table_size (table_id, w_formel, h_formel, wait_time, delay) // Die Groesse einer Tabelle oder eines Tabellenteils an die Fenstergroesse bzw. Bildschirmgroesse anpassen // table_id = Id (nicht Name) der Tabelle, einer Zeile oder einer Zelle // w_formel = Formel zur Berechnung der Breite, dabei ist"W" die (innere) Fensterbreite , "-" = nichts machen // h_formel = Formel zur Berechnung der Hoehe, dabei ist"H" die (innere) Fensterhoehe , "-" = nichts machen { if ( (typeof(document.getElementById(table_id)) == "object") && (document.getElementById(table_id) != null) ) { // Firefox mosert manchmal, dass der Elementknoten null ist - Keine Ahnung, wie das nach der Abfrage nach object vorkommen kann // Aktuelle Groesse: var Elementknoten = document.getElementById(table_id); // alert ("Ereignis: " + Ereignis + " Tabellen-Element " + table_id + ": Elementknoten: " + Elementknoten); var curr_width = Elementknoten.width; var curr_height = Elementknoten.height; // alert ("Tabellen-Element " + table_id + ": Breite: " + curr_width + " - Hoehe: " + curr_height); // Nutzbare Breite und Hoehe // if (typeof(Nutzbare_Breite) == "undefined") { } // Nein, weil ggf. nach jeder Fensteraenderung neu berechnet werden soll get_window_width_height(); // Das Resultat ist nutzbare Breite und Hoehe W = Nutzbare_Breite; // für die Formel H = Nutzbare_Hoehe; // für die Formel if (typeof(w_formel) != "undefined") { if (w_formel != "-") { Elementknoten.width = Math.ceil(eval(w_formel)); } } if (typeof(h_formel) != "undefined") { if (h_formel != "-") { Elementknoten.height = Math.ceil(eval(h_formel)); } } var new_width = Elementknoten.width; var new_height = Elementknoten.height; // alert ("Tabellen-Element " + table_id + ": Neue Breite: " + new_width + " - Neue Hoehe: " + new_height); } else { // alert ("Ereignis: " + Ereignis + " Tabellen-Element " + table_id + ": Elementknoten: " + document.getElementById(table_id) + " - not object or null"); /* if (typeof(eval('wait_time' + table_id)) == 'undefined') // Funktioniert nicht, weil in table_id "-" vorkommen (koennen), die als Zeichen im Namen nicht erlaubt sind { eval('var wait_time' + table_id + ' = 0'); eval('var delay' + table_id + ' = 50'); // start value for delay time in milliseconds - the first delay is then 100 ms eval('var max_wait_time' + table_id + ' = 1000'); // max time to wait is 1 second } if (eval('wait_time' + table_id) < eval('max_wait_time' + table_id) ) { eval('delay' + table_id + ' = 2 * delay' + table_id); // double the delay each time eval('wait_time' + table_id + ' = wait_time' + table_id + ' + delay' + table_id); eval('Id' + table_id) = window.setTimeout( function() {change_table_size (table_id, w_formel, h_formel, eval('wait_time' + table_id), eval('delay' + table_id));} , eval('delay' + table_id)); // Firefox und IE: Wird korrekt ausgefuehrt } // *** the delayed function runs in a separate execution context! *** */ if (typeof(wait_time) == 'undefined') { var wait_time = 0; delay = 50; // start value for delay time in milliseconds - the first delay is then 100 ms } var max_wait_time = 1000; // max time to wait is 1 second if (wait_time < max_wait_time) { delay = 2 * delay; // double the delay each time wait_time = wait_time + delay; Id = window.setTimeout( function() {change_table_size (table_id, w_formel, h_formel, wait_time, delay);} , delay); // Firefox und IE: Wird korrekt ausgefuehrt } // *** the delayed function runs in a separate execution context! *** } } function flinke_pfoten_adapt () // Groessenanpassung fuer Webseiten von www.flinke-pfoten.de { var bildid = "Flinke-Pfoten-Hund-headline"; // alert ("Bild " + bildid + ": Breite: " + document.getElementById(bildid).width + " - Hoehe: " + document.getElementById(bildid).height); var bildid = "Flinke-Pfoten-Schrift-headline"; // alert ("Bild " + bildid + ": Breite: " + document.getElementById(bildid).width + " - Hoehe: " + document.getElementById(bildid).height); } /* ************************* Datei-Ende ************************************************* */