|
|||
Elemente mit Javascript zählen
Hallo
also ich habe ein einfaches, aber für mich nicht zu lösen des Problem... also in meiner kleinen Thumbgallery müßte man per Hand den CSS-code anpassen wenn man die Anzahl der Bilder ändert... ich könnte mir Vorstellen das Javascript ohne Probleme die Elemente in der Liste zählen kann. Den 'count' mit einer Breite multipliziert und dann die Breite im CSS-Code anpasst. HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>visusta.com - your e-learning source for statics</title> <style type=text/css> * {border:0px; padding:0px; margin:0px;} body {background:#FFFFFF; font-family:Helvetica, Arial, sans-serif; font-size:75%; color:#000000; text-align: center; cursor:default;} .page {margin:10px; padding:10px; background:#007EC6; min-width:940px;} .related {border:#FFD98F 1px solid; height:211px;} .relatedout {margin:10px 5px; height:193px; overflow-x:scroll;} .relatedin {width:9999px; heigth:168px;} /*Hier müßte man "width" per Hand immer anpassen*/ /*Javascript sollte z.B. 'LI' zählen mit 178px multiplizieren und dann 10px abziehen*/ /*also ('count LI' * 178px) - 10px*/ .relatedin ul {list-style:none; margin-left: -10px; } .relatedin ul li {float:left; cursor:pointer;} .relatedin h2 {display:none;} .relatedin div {margin-left: 10px; background:#000000; width:168px; height:168px;} </style> </head> <body> <div class="page"> <div class="related"> <div class="relatedout"> <div class="relatedin"> <ul> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> <li><h2>Ähnliches Projekt</h2><div></div></li> </ul> </div> </div> </div> </div> </body> </html> Hier mein Ansatz... den ich mir zusammen reimen konnte, aber wirklich Ahnung habe ich nicht!!! habe lediglich versucht Analogien aus anderen Skripten zu ziehen... function breitenangabe() {var count = document.getElementByClass('relatedin').getElement sByTagName('LI').length; breite=count*178px-10px document.getElementByClass('relatedin').replace(?? ????) } breitenangabe(); |
Sponsored Links |
|
|||
Hm, das mit den ClassName ist komisch...
AufSELFHTML: JavaScript / Objektreferenz / HTML-Elementobjekte wird es als Universalattribute geführt hatte daher gedacht man könnte es so benutzen, aber na ja... ich bringe da bestimmt etwas durcheinander... also ich raffe es trotzdem nicht... habe jetzt den Code jetzt versucht an verschiedenen stellen einzufügen, aber nichts klappt... Code:
<script type="text/javascript"> function adjustWidth() { var elem = document.getElementById('relatedin'); var count = elem.getElementsByTagName().length; elem.style.width = ((count * 178) - 10) + 'px'; } </script> Muß das Script noch irgenwie aktiviert werden? (onload oder ähnliches???) bei den anderen scripten brauchte ich das nicht, aber funktionieren tut dieses ja nicht??? |
Sponsored Links |
|
|||
Zitat:
Und wenn sie es nicht ist, was man ja abfragen kann, verwendet man hilfsweise eine der vielen getElementsByClass-Funktionen, die man im Netz finden kann.
__________________
Gruß, Cybaer |
|
|||
Zitat:
__________________
Gruß, Cybaer |
|
|||
Zitat:
Fakt ist: Es gibt zahlreiche Browser, die das bereits nativ unterstützen, und es gibt zahlreiche Browser, die das nicht tun, denen man diese Funktionalität aber einfach beibringen kann. Es ist nicht abzusehen, wann die letzten Browser verschwunden sein werden, die das nicht nativ unterstützen. Aber darauf Rücksicht zu nehmen, ist ja wg. der ohnehin notwendigen Pflicht zur Alternative auch überhaupt nicht notwendig ... Zitat:
Ansonsten muß ich bei den Frameworks immer an die berechtigte Kritik zu Prototype aus der JS-Newsgroup denken: Für Leute die kein JavaScript programmieren können, von Leuten die kein JavaScript programmieren können. Und wenn ich alleine an die zahlreichen technisch mangelhaften (und inhaltlich noch nicht mal begründbaren) "Browserweichen" in jQuery denke, dann kann ich nur eines empfehlen: Abstand. Aber das wird natürlich kein Script-Kiddie davon abhalten, zweifelhafte Scripts mit zweifelhaftem Sinn, basierend auf zweifelhaften Frameworks ins Web zu rotzen ... ... bei der Menge Schrott kommt es auf ein wenig mehr Schrott ja auch gar nicht mehr an.
__________________
Gruß, Cybaer |
|
||||
Wie wäre es mit einer reinen CSS Lösung? Floating thumbnails passen sich an die Browser-Breite an.
__________________
My knowledge is your right |
|
||||
Zitat:
Zitat:
Zitat:
was den ClassName betrifft, so ist es für mich müßig über den Support und irgendwelche Browserweichen nachzudenken, wenn ich doch recht einfach aus der class eine id machen kann und es dann von allen verstanden wird (soweit ich euch jetzt folgen konnte)... also nichts gegen eure Diskussion, aber ich als Anfänger verstehe nichts von solchen Detailfragen... mal schauen, wenn ich in ein paar monaten oder jahren ein wenig mehr Erfahrung habe, kann ich vielleicht mit solchen Gedankengängen etwas anfangen, aber momentan Tillt mein Kopf bei so etwas... Zitat:
Danke für eure Mühen!!! |
|
|||
hm, habe das onload jetzt weggelassen und das <script> ans Ende des Bodys geschrieben. und wird es ohne onload geladen und blockiert das andere skript nicht mehr... mir fehlt zwar jetzt noch die erkenntnis warum? das sich jetzt alles so verhält...
Das eine Skript muss im head stehen, den andrem ist es egal wo es steht, aber es stört ein anderes ... usw... usw... Ich verstehe nur Bahnhof... da brauche ich wohl noch ein paar lesestunden bis ich wirklich dahinter steige... Geändert von therug (07.11.2008 um 13:57 Uhr) |
Sponsored Links |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
jQuery: li -elemente innerhalb von ul zählen? | sepp88 | Javascript & Ajax | 5 | 05.07.2010 21:52 |
Wort in Javascript Code einfügen; dann Javascript Code ausgeben | Sp33dy G0nz4l3s | Javascript & Ajax | 1 | 23.05.2008 10:37 |
Impressumsaufruf mit Javascript | Sinclair | Javascript & Ajax | 6 | 19.05.2008 16:41 |
Welche Positionierung für elemente eines Formulas? | bastien | CSS | 3 | 01.01.2007 23:31 |
Javascript, Datentabelle und Screenreader | laborix | Barrierefreiheit | 8 | 02.04.2006 19:25 |