Sponsored Links |
|
|||
Vergiss das mit dem Javascript. Ja, du hast da schon Arbeit reingesteckt und man könnte doch... Nein, vergiss es.
Dafür gibt es CSS Mediaqueries, mit denen du das unkompliziert umsetzen kannst. Verabschiede dich auch von festen Pixelwerten sondern platziere deine Elemente in Relation zueinander. Sprich: Positioniere dein Element zB immer 20% von links und lass es immer 40% Größe haben mit einer min-width und min-height von xyz-Pixeln. Das, was du mit jQuery machen willst ist kein mobile-first sondern ein zusammenpfuschen von Dingen, die dir nur Probleme machen können. zB um nur eines zu nennen: Du schreibst von "mobile first". Dreht dein Benutzer sein "mobile" dann müsstest du wieder alles neu per JS berechnen. Aber da wird kein document.ready abgefeuert. Zusammenfassung: Vergiss das mit jQuery wirklich, auch wenn du jetzt einiges löschen musst. Und verwende CSS Mediaqueries, dafür sind sie da. |
Sponsored Links |
|
||||
Hallo,
danke für die Antwort. Das mit den Mediaqueries hatte ich schon und fand es recht unschick, ca. alle 50 px Viewportvergrößerung abfangen zu müssen, um das Bild dann um 1px nach unten zu setzen. Hier mal ein rudimenäres fiddle, um zu verdeutlichen was ich eigentlich erreichen will. Die Schrift vom Logobild soll immer auf den Rand vom Content aufsitzen, das "g" soll in den Content hineinragen. Nun verkleinert/vergrößert sich das Logobild natürlich mit seinem übergeordneten div. Im Beispiel habe ich jetzt keine Breakpoints gesetzt, spielt aber für's Verständnis aber auch keine Rolle, denke ich. Danke und Gruß mimii |
|
||||
Vielleicht solltest du dir einfach mal überlegen, ob diese Vorgangsweise und der Sinn dahinter einfach unerschließbar sind?
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
|
||||
Zitat:
|
|
||||
Die inline-Blocks laufen (fast) so wie es sein soll. Hier geht es lediglich darum dass die Schrift vom Logo auf dem content aufsitzt und das immer, egal welche Größe das Logo grad hat.
Vielleicht denke ich ja zu verquert, ich wollte die position - top jeweils anpassen. |
|
||||
So in etwa:
HTML-Code:
<!doctype html> <meta charset="UTF-8"> <title>mimii :: xhtmlforum.de</title> <style> img { height: auto; max-width: 100%; } header { position: relative; white-space: nowrap; } #logo, #navi { width: 50%; display: inline-block; } #logo { vertical-align: bottom; } #logo img { vertical-align: bottom; margin-bottom: -20px; } #navi { vertical-align: top; background-color:#abc; } #navi p { white-space: normal; } #content { background-color:#ccc; height:200px; padding:20px; } </style> <header class="clearfix"> <div id="logo"> <img src="http://www.dj-macomar.de/images/test.png" alt="test"> </div> <div id="navi"> <p>Navigation </p> </div> </header> <div id="content"> <p>Content</p> </div> |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Das jQuery UI Accordion Plugin ohne jquery kenntnisse nutzen? | papalapap | Javascript & Ajax | 8 | 13.08.2012 23:00 |
jQuery (coda slider) und prototype (Lightbox) konflikt | computernerd | Javascript & Ajax | 3 | 21.09.2011 20:04 |
jquery Plugins in Wordpress nutzen? | hdwolle | Javascript & Ajax | 2 | 10.01.2010 17:15 |
JQuery + Wordpress | VoinG | Javascript & Ajax | 0 | 29.12.2008 17:03 |
iframe Größe bei Laden des Inhalts an dessen Größe anpassen | wiseguy | Javascript & Ajax | 0 | 24.06.2007 23:04 |