Archiv

Artikel Tagged ‘Webentwicklung’

Cross Browser – JavaScript zur Iframe-Höhenanpassung

4. Juni 2010

Vor einigen Wochen bekam ich den Auftrag eine Forensoftware in ein Internet-Portal einzubetten. Dies geschieht sinnvollerweise mit einem Iframe.

Nun eigentlich kein Problem, aber der Teufel steckt im Detail …

Automatische Breitenanpassung ist einfach: Der iFrame bekommt das Attrribut ‘width=”100%”‘

Die Anpassung der Höhe ist aber schwieriger. Man muss bedenken, dass sich die Höhe des Fensters bei der Arbeit mit der im Iframe eingebetteten Applikation permanent ändert. Bei einem Forum : Die Fensterhöhe der Forenübersicht wird sicher unterschiedlich zur Ansicht eines beliebigen Artikels sein. Und bei verschiedenen Artikeln ist die Höhe sicher auch jedesmal anders.

Eine Antwort darauf ist die Angabe eine festen Höhe im Iframe. Also zum Beispiel mit ‘height=”500px”‘. Passt diese Größe nicht, dann werden durch die Default-Voreinstellung ’scrolling=”auto”‘ automatisch Scrollbars (Bildlaufleisten in deutsch) erzeugt. Schön ist etwas anderes ;-)

Was also tun ? Die andere Antwort ist ein JavaScript-Event an den Iframe zu “hängen”. Dieser wird bei jeder Größenänderung des eingebetteten Applikations aktiviert und kann dazu benutzt werden, die Größe des Iframes entsprechend zu ändern.

Klingt doch gut, nicht wahr ? Leider ist es nicht so ganz einfach, weil das Document Object Model (DOM) des Iframes auf jedem Browser anders ist. (DOM : damit kann man jedes Element einer HTML-Seite von z.B. JavaScript adressieren und ändern; z.B. auch die Höhe des Iframes)

Nun nachdem ich durch diese Hölle der Inkompatibilitäten gegangen bin, ist ein Script entstanden, das ich mit der Welt teilen möchte. Hoffe damit einigen Web-Entwicklern dieser Welt einige graue Haare zu ersparen ;-)

Mehr…

Allgemeines, Open Source, Web 2.0 , ,

Schweizer Messer für Webentwickler : firebug

29. Mai 2009

Nachdem ich vor einiger Zeit einem gestandenen Webentwickler über die Schulter geschaut habe und mit Erstaunen feststellen musste, dass er den Feinschliff seines Designs noch mühsam vollkommen manuell im “Try and Error”-Verfahren durchgeführt hat, habe ich mich entschlossen nun diesen Artikel über meine Design-Optimierungstools zu schreiben. Möglicherweise gehts anderen altgedienten Webentwicklern ja ähnlich ;-) und alle Nicht-Techniker, die sich lieber nicht mit html und css abplagen möchten, bekommen einen Einblick in diese Arbeit…

Meine “Schweizer Messer” sind die Add-Ons “Firebug” und “Web Developer” für den freien Browser Firefox.

Diese möchte ich im Folgenden anhand einiger Screenshots erläutern.

Mehr…

Allgemeines, Open Source, Web 2.0 , ,

Wie kommt eine Webseite eigentlich ins Netz ?

3. April 2009

…oder was hat meine Gartenhütte mit meiner Webseite zu tun ;-) ?

Aus gegebenem Anlass zeige ich mal kurz auf, wie eine Website eigentlich so das Licht der Welt erblickt, wer da wie dran rumbastelt und was man von den einzelnen Beteiligten erwarten kann und was nicht ;-)

Ich hoffe ich reduziere mit diesem Artikel die Anzahl der Missverständnisse bei dem einen oder anderen Webseiten-Projekt ;-)   …

Beginnen wir mit einer Analogie : “Ich möchte mir ein Haus bauen lassen!”.

Mehr…

Allgemeines , , , ,

Webseiten und Schriftarten (Fonts)

31. März 2009

Ein immer wieder kehrender Diskussionspunkt mit Kunden sind die Schriftarten, die sie auf ihren neuen Webseiten sehen möchten. Meist hat ihnen der Designer ihres Vertrauens ein tolles Logo mit Text (Claim) gebastelt und dabei aus dem Vollen geschöpft. Es gibt ja Unmengen von verschiedenen Schriftarten und die dann noch fett, italic, fett italic oder anderen Permutationen. Für Printmedien und Grafiken ist das auch weiter kein Problem. Kann man machen … Da kann man sich sogar eine Schriftart für halbwegs billiges Geld kaufen, da nicht alle frei verfügbar sind (tatsächlich sind nur die wenigsten wirklich frei verfügbar …).

Nun ist natürlich die Erwartungshaltung die, dass man seine Schriften auf der neuen Webseite auch gerne in diesem Font (Schriftart) haben möchte. Kann ich nachvollziehen. Leider ist dies aber nur selten möglich. Warum das so ist, möchte ich mit diesem Artikel etwas näher beleuchten …

Mehr…

Allgemeines, Web 2.0 , , ,