tag:forum.selfhtml.org,2005:/self Die Breite mehrerer gleicher Elemente verändern – SELFHTML-Forum 2007-12-06T14:06:35Z https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188779#m1188779 Peter 2007-12-05T19:07:44Z 2007-12-05T19:07:44Z Die Breite mehrerer gleicher Elemente verändern <p>Guten Abend!</p> <p>Es geht um folgendes: Mit window.innerWidth und einem entsprechenden Handler lasse ich einige Objekte auf meiner Website dynamisch an die Browsergröße anpassen.</p> <p>Doch irgendwie klappt nichts.</p> <p>Die zu verändernden Elemente sehen so aus:</p> <p><div class="backtotop" id="backtotop"><br> <a href="#top" target="_top">Nach oben</a><br> </div></p> <p>Ich habe bereits viele verschiedene Codes ausprobiert, doch funktioniert irgendwie keiner :/<br> Das ist der aktuelle:</p> <p>var backtotop = document.getElementById("backtotop").getElementsByTagName("div");<br> for (var i = 0; i < backtotop.length; i++;) {<br> document.getElementById("backtotop").style.width = (width - 290) + "px";<br> }</p> <p>Bitte, könnt ihr mir sagen was ich falsch mache und mir evtl. ein Beispiel geben wie es funktioniert?</p> <p>Lg,<br> Peter</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188782#m1188782 frankx frankxberlin@gmx.de 2007-12-05T19:20:39Z 2007-12-05T19:20:39Z Die Breite mehrerer gleicher Elemente verändern <p>Hellihello Peter,</p> <blockquote> <p>Guten Abend!</p> <p>Es geht um folgendes: Mit window.innerWidth und einem entsprechenden Handler lasse ich einige Objekte auf meiner Website dynamisch an die Browsergröße anpassen.</p> <p>Doch irgendwie klappt nichts.</p> <p>Die zu verändernden Elemente sehen so aus:</p> <p><div class="backtotop" id="backtotop"><br> <a href="#top" target="_top">Nach oben</a><br> </div></p> <p>Ich habe bereits viele verschiedene Codes ausprobiert, doch funktioniert irgendwie keiner :/<br> Das ist der aktuelle:</p> <p>var backtotop = document.getElementById("backtotop").getElementsByTagName("div");</p> </blockquote> <p>Also alle Divs des Elements mit er Id "backtotop"?</p> <blockquote> <p>for (var i = 0; i < backtotop.length; i++;) {<br> document.getElementById("backtotop").style.width = (width - 290) + "px";</p> </blockquote> <p>das ist doch murks. Das i taucht ja garnicht auf. Auch holst Du ja wieder nur das Element mit der id "backtotop" statt backtotop[i].style.width...;</p> <p>Aber dein Beispiel enthälte keine divs, die in der NodeList auftauchen könnten.</p> <p>Dank und Gruß,</p> <p>frankx</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188781#m1188781 bleicher koro@nm.ru http://bleicher.awardspace.com 2007-12-05T19:22:06Z 2007-12-05T19:22:06Z Die Breite mehrerer gleicher Elemente verändern <p>Grüße,<br> so wie ich die gewünschte Wirkung der Funktion enschätze würde es auch CSS tun - gibts einen Grund JS zu verwenden? den ndies ist (wenn es um layoutgrundlage geht) nicht so sicher.<br> MFG<br> bleicher</p> <div class="signature">-- <br> __________________________-<br> Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).<br> Lieber bereuen gesündigt zu haben, als nicht sündigen und es später trotzdem bereuen.<br> Boccaccio </div> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188780#m1188780 steckl stefan-stoeckl@gmx.de 2007-12-05T20:23:31Z 2007-12-05T20:23:31Z Die Breite mehrerer gleicher Elemente verändern <p>Hi,</p> <blockquote> <p>Guten Abend!</p> <p>Es geht um folgendes: Mit window.innerWidth und einem entsprechenden Handler lasse ich einige Objekte auf meiner Website dynamisch an die Browsergröße anpassen.</p> </blockquote> <p>Dass hier Javascript wohl der falsche Weg ist wurde ja bereits erwähnt.<br> Sieht aus als würdest du mit JS die CSS-Eigenschaft <a href="http://de.selfhtml.org/css/eigenschaften/randabstand.htm#margin_right" rel="nofollow noopener noreferrer">margin-right</a> (bzw. <a href="http://de.selfhtml.org/css/eigenschaften/innenabstand.htm#padding_right" rel="nofollow noopener noreferrer">padding-right</a>) simulieren wollen.</p> <p>Aber ich schreibe trotzdem mal einige Anmerkungen zu deinem Code, da dies ja immerhin einen Lerneffekt haben könnte.</p> <blockquote> <p>Die zu verändernden Elemente sehen so aus:</p> <p><div class="backtotop" id="backtotop"><br> <a href="#top" target="_top">Nach oben</a><br> </div></p> </blockquote> <p>Die ID muss eindeutig sein und darf in deinem Dokument nur einmal vorkommen.</p> <blockquote> <p>var backtotop = document.getElementById("backtotop").getElementsByTagName("div");</p> </blockquote> <p>Du könntest hier alle DIVs in backtotop speichern, wenn du das getElementById was hier eh nicht passt (weil es ja nur ein Element mit der ID geben darf) wegläßt. Dann stehen in backtotop alle div-Elemente.</p> <blockquote> <p>for (var i = 0; i < backtotop.length; i++;) {</p> </blockquote> <p>In dieser Schleife kannst du dann die einzelnen Elemente von backtotop durchlafuen und mit einem if und der Eigenschaft <a href="http://de.selfhtml.org/javascript/objekte/all.htm#class_name" rel="nofollow noopener noreferrer">className</a> abprüfen, ob das Element zur Klasse backtotop gehört. Und den folgenden Code nur ausführen, wenn es dazugehört.</p> <blockquote> <p>document.getElementById("backtotop").style.width = (width - 290) + "px";</p> </blockquote> <p>Hier kannst du direkt über backtotop[i] auf die Elemente zugreifen.<br> Ist width eine Variable?</p> <blockquote> <p>}</p> <p>Bitte, könnt ihr mir sagen was ich falsch mache und mir evtl. ein Beispiel geben wie es funktioniert?</p> </blockquote> <p>Hoffe ich konnte dir weiterhelfen. Und noch ein Tipp: Wenn deine Scripts nicht funktionieren wirf mal einen Blick in die Fehler-Konsole vom Firefox (unter Extras -> Fehler-Konsole), dort werden dir deine Javascript-Fehler angezeigt.</p> <p>mfG,<br> steckl</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188790#m1188790 Peter 2007-12-05T20:38:05Z 2007-12-05T20:38:05Z Die Breite mehrerer gleicher Elemente verändern <p>Danke für eure Antworten ... ihr habt recht .. das ist nur Gepfusche auf diese Weise ..</p> <p>Habe es jetzt mit CSS hinbekommen. :)</p> <p>Lg,<br> Peter</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188783#m1188783 Struppi struebig@gmx.net http://javascript.jstruebig.de 2007-12-06T09:29:14Z 2007-12-06T09:29:14Z Die Breite mehrerer gleicher Elemente verändern <blockquote> <p>Also alle Divs des Elements mit er Id "backtotop"?</p> <blockquote> <p>for (var i = 0; i < backtotop.length; i++;) {<br> document.getElementById("backtotop").style.width = (width - 290) + "px";</p> </blockquote> <p>das ist doch murks. Das i taucht ja garnicht auf. Auch holst Du ja wieder nur das Element mit der id "backtotop" statt backtotop[i].style.width...;</p> <p>Aber dein Beispiel enthälte keine divs, die in der NodeList auftauchen könnten.</p> </blockquote> <p>So! und hier haben wir so ein Beispiel, wo man mit der Vermeidung einer Technik(JS), eine einfachere <a href="https://forum.selfhtml.org/?t=163141&m=1062201" rel="noopener noreferrer">Lösung</a> erhält, exakt das was ich in <a href="https://forum.selfhtml.org/?t=162934&m=1061597" rel="noopener noreferrer">dieser Diskussion</a> meinte ("Ach, wenn Du meinst.")</p> <p>Struppi.</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188784#m1188784 frankx frankxberlin@gmx.de 2007-12-06T12:52:16Z 2007-12-06T12:52:16Z Die Breite mehrerer gleicher Elemente verändern <p>Hellihello Struppi,</p> <blockquote> <p>So! und hier haben wir so ein Beispiel, wo man mit der Vermeidung einer Technik(JS), eine einfachere <a href="https://forum.selfhtml.org/?t=163141&m=1062201" rel="noopener noreferrer">Lösung</a> erhält, exakt das was ich in <a href="https://forum.selfhtml.org/?t=162934&m=1061597" rel="noopener noreferrer">dieser Diskussion</a> meinte ("Ach, wenn Du meinst.")</p> </blockquote> <p>Ja, darüber hatte ich schon nachgedacht. Natürlich hast Du Recht. "Aber": er hat nicht kapiert, wie Javascript den DOM-Baum und seine Attribute anspricht, was eine Nodelist ist und wie ich mit dem Iterator (?) hantiere, um einzelne Elemente daraus anzusprechen. Wenn du jetzt sagt, dass das u.U. nicht sein Ziel war, hast Du vermutlich sogar auch Recht.</p> <p>Letztlich haben in der HTML-AG zwei 15-jährige erstmal buttons um ein a-tag gebastelt, weil sie die Breite definieren wollten. Und kamen dann mit einer Seite: diese Seite ist nur mit FF lesbar (;-), weil der IE(6) die <a> in <button> nicht mehr als Links interpretiert. Vielleicht lernt man so nicht gleich, wies richtig geht, aber _vielleicht_ erwirbt man so - durch Irr- oder Seitenwege - auch ein (evtl. tiefergehendes) Verständnis, was dann später mal hilfreich sein kann. Was nicht heißen muss, dass ich ihnen, hätt ich gleich dabeigesessen, die button-Idee vielleicht schon in den Anfängen versucht hätte auszureden.</p> <p>Zudem gilt natürlich auch: jeder Lehrer (und wenn Stammposter hier antworten, dann sind sie das erstmal auch) kann natürlich seinen Weg gehen. Also wer sagt, ich führ Dich gleich auf den richtigen Pfad und zwar nach meinem gusto, hat schon deswegen Recht, weil er ja seine Hilfe obendrein noch ehrenamtlich hier anbietet.</p> <p>Dank und Gruß,</p> <p>frankx</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188785#m1188785 Struppi struebig@gmx.net http://javascript.jstruebig.de 2007-12-06T13:23:57Z 2007-12-06T13:23:57Z Die Breite mehrerer gleicher Elemente verändern <blockquote> <p>Natürlich hast Du Recht.</p> </blockquote> <p>Ich weiß ;-)</p> <p>Ich geb dir aber auch absolut Recht, dass man natürlich mit u.U. umständlichen "Lösungen" etwas lernt und wenn z.b. Peter sich darauf versteift hätte es mit JS zu machen oder eben den Bewegrund das er was lernen möchte erwähnt hätte, spricht ja nichts dagegen ihm auch diese Möglichkeit zu zeigen.</p> <p>Es ging mir aber in ertser Linie darum dir aufzuzeigen, dass der Vorschlag auf eine Technik zu verzichten und das jemanden zu raten, nicht darauf schliessen läßt das jemand ein XY-Hasser ist.</p> <p>Struppi.</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188786#m1188786 frankx frankxberlin@gmx.de 2007-12-06T13:43:22Z 2007-12-06T13:43:22Z Die Breite mehrerer gleicher Elemente verändern <p>Hellihello Struppi,</p> <blockquote> <p>Ich geb dir aber auch absolut Recht, dass man natürlich mit u.U. umständlichen "Lösungen" etwas lernt und wenn z.b. Peter sich darauf versteift hätte es mit JS zu machen oder eben den Bewegrund das er was lernen möchte erwähnt hätte, spricht ja nichts dagegen ihm auch diese Möglichkeit zu zeigen.</p> <p>Es ging mir aber in ertser Linie darum dir aufzuzeigen, dass der Vorschlag auf eine Technik zu verzichten und das jemanden zu raten, nicht darauf schliessen läßt das jemand ein XY-Hasser ist.</p> </blockquote> <p>Der Fachbereichsleiter Mathematik/Informatik meines ehem. Gymnasiums, wo ich jetzt die HTML-AG leite, sagte mir letztlich: "Ich bin Vorsitzender des Excel-Hasser-Clubs". Er hat aus diversen Gründen eine sicher auch berechtigte Abneigung. Das muss man nicht teilen. Wollte nur nochmal das Wort "Hasser" als Mode-Wort für "mag ich nicht unbedingt" klarstellen.</p> <p>Diese von mir gefühlte Tendenz - lass mal lieber die Finger erstmal von Javascript - rührt vielleicht von einer tendenziellen Abneigung gegen klicki-bunti bzw. Vorliebe für textlastige (=informationshaltige) Strukturen her, die ich bei einigen hier im Forum zu bemerken meine. Ist doch o.k. und kann ich sogar zu Teilen nachvollziehen. Was insbesondere Gunnar jetzt gegen Frames hat (ich fände es wirklich auch passend, wenn es ein selfhtml-Artikel wäre, auf den verwiesen wird), hab ich noch nicht rausbekommen. Ich könnte mir mittlerweile vorstellen, dass er heimlich mit seinem Blackberry surft oder einen 15-Zoll Monitor hat oder so (;-) - weil er immer auf den Viewport verweist.</p> <p>Ich sehe halt, dass sich sowohl mit Frames (Abstraktion weil "includieren") aber insbesondere mit JS (über a) Programmieren und b) DOM) was lernen lässt. Ist vielleicht eher eine grundlagenforschungsorientierter Ansatz (und wie schon gesagt ein autorenlastiger: meine Seite gehört mir (;-)).</p> <p>Dank und Gruß,</p> <p>frankx</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188789#m1188789 Kai345 k345@alpenjodel.de http://www.kaichen.in/ 2007-12-06T13:57:51Z 2007-12-06T13:57:51Z Die Breite mehrerer gleicher Elemente verändern <p>Grütze .. äh ... Grüße!</p> <p>[Gunnar]</p> <blockquote> <p>verwiesen wird), hab ich noch nicht rausbekommen. Ich könnte mir mittlerweile vorstellen, dass er heimlich mit seinem Blackberry surft oder einen 15-Zoll Monitor hat oder so (;-) - weil er immer auf den Viewport verweist.</p> </blockquote> <p>?</p> <p>Auch (bzw. gerade) auf einem Monitor mit Auflösung >= 1200 ist die Wahrscheinlichkeit, daß das Browserfenster nicht voll aufgezogen ist, sehr groß. Hinzu kommen diverse side- und toolbars, also hat Gunnar absolut recht, wenn er beständig gegen die immer noch weit verbreitete Unsitte argumentiert, daß die Bildschirmgröße auch nur irgend eine Bedeutung hätte. Maßgeblich ist und bleibt immer noch der Bereich, auf dem die eigentliche Webseite dargestellt werden kann, und da das nun einmal der Viewport ist ....</p> <p>Cü<br> Kai</p> <div class="signature">-- <br> What is the difference between Scientology and Microsoft? One is an<br> evil cult bent on world domination and the other was begun by L. Ron<br> Hubbard.<br> ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:| </div> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188787#m1188787 Struppi struebig@gmx.net http://javascript.jstruebig.de 2007-12-06T13:57:53Z 2007-12-06T13:57:53Z Die Breite mehrerer gleicher Elemente verändern <blockquote> <p>Wollte nur nochmal das Wort "Hasser" als Mode-Wort für "mag ich nicht unbedingt" klarstellen.</p> </blockquote> <p>Schon klar, ich hab das durchaus so verstanden ;-)</p> <blockquote> <p>Diese von mir gefühlte Tendenz - lass mal lieber die Finger erstmal von Javascript - rührt vielleicht von einer tendenziellen Abneigung gegen klicki-bunti bzw. Vorliebe für textlastige (=informationshaltige) Strukturen her, die ich bei einigen hier im Forum zu bemerken meine.</p> </blockquote> <p>Da ich fast alle JS Threads hier lese (und das seit einigen Jahren), weiß ich nicht woher dein Gefühl kommt. Im gegenteil hier werden oft und gerne irgendwelche Spielreien mit JS entwickelt.</p> <p>Nur wenn der Fragende sich mit JS andere Wege verbaut, wird natürlich nochmal hinterfragt ob ihm das bewußt ist und ob er das wirklich will, bevor man eine zweifelhafte Lösung anbietet.</p> <blockquote> <p>Was insbesondere Gunnar jetzt gegen Frames hat (ich fände es wirklich auch passend, wenn es ein selfhtml-Artikel wäre, auf den verwiesen wird), hab ich noch nicht rausbekommen. Ich könnte mir mittlerweile vorstellen, dass er heimlich mit seinem Blackberry surft oder einen 15-Zoll Monitor hat oder so (;-) - weil er immer auf den Viewport verweist.</p> </blockquote> <p>Du kannst auch ohne Probleme auf einem 100" Monitor die Fenstergrößen ändern. Ich kann aus eigener Erfahrung sagen, das bei mir z.b. oft das Browserfenster auf Systemen mit grosser Auflösung kleiner ist als auf alten mit kleinen Monitoren und Auflösung. Daher sind für mich Framesetseiten auch oft lästig, da ich erstmal das Fenster gross machen muss um den Inhalt  entsprechend lesen zu können. Aber ich beschäftige mich seit Jahren nicht mehr mit Framesets, deshalb ignoriere ich i.d.R. auch die Fragen dazu.</p> <blockquote> <p>Ich sehe halt, dass sich sowohl mit Frames (Abstraktion weil "includieren") aber insbesondere mit JS (über a) Programmieren und b) DOM) was lernen lässt. Ist vielleicht eher eine grundlagenforschungsorientierter Ansatz (und wie schon gesagt ein autorenlastiger: meine Seite gehört mir (;-)).</p> </blockquote> <p>Kann man, muss man aber nicht ;-)</p> <p>Da stellt sich dann die Frage, ob das Lernziel sinnvoll ist oder nicht oder ob nicht der andere Weg mehr Lerninhalte birgt. Aber das dürfte von Fall zu Fall verschieden sein.</p> <p>Struppi.</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188788#m1188788 frankx frankxberlin@gmx.de 2007-12-06T14:06:35Z 2007-12-06T14:06:35Z Die Breite mehrerer gleicher Elemente verändern <p>Hellihello Struppi,</p> <blockquote> <p>Da ich fast alle JS Threads hier lese (und das seit einigen Jahren), weiß ich nicht woher dein Gefühl kommt. Im gegenteil hier werden oft und gerne irgendwelche Spielreien mit JS entwickelt.</p> <p>Nur wenn der Fragende sich mit JS andere Wege verbaut, wird natürlich nochmal hinterfragt ob ihm das bewußt ist und ob er das wirklich will, bevor man eine zweifelhafte Lösung anbietet.</p> </blockquote> <p>Nun, das doch mal eine aussagekräftige Quelle.</p> <blockquote> <blockquote> <p>Ich sehe halt, dass sich sowohl mit Frames (Abstraktion weil "includieren") aber insbesondere mit JS (über a) Programmieren und b) DOM) was lernen lässt. Ist vielleicht eher eine grundlagenforschungsorientierter Ansatz (und wie schon gesagt ein autorenlastiger: meine Seite gehört mir (;-)).</p> </blockquote> <p>Kann man, muss man aber nicht ;-)</p> <p>Da stellt sich dann die Frage, ob das Lernziel sinnvoll ist oder nicht oder ob nicht der andere Weg mehr Lerninhalte birgt. Aber das dürfte von Fall zu Fall verschieden sein.</p> </blockquote> <p>Genau, wie die Freiheit des Autors so natürlich auch die Freiheit des Lehrenden.</p> <p>Dank und Gruß,</p> <p>frankx</p> https://forum.selfhtml.org/self/2007/dec/5/die-breite-mehrerer-gleicher-elemente-veraendern/1188791#m1188791 steckl stefan-stoeckl@gmx.de 2007-12-05T20:50:56Z 2007-12-05T20:50:56Z Die Breite mehrerer gleicher Elemente verändern <p>Hi,</p> <blockquote> <p>Habe es jetzt mit CSS hinbekommen. :)</p> </blockquote> <p>Brav ;)</p> <p>mfG,<br> steckl</p>