• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

DIV: height:auto in px weiterverwenden

BMicraft

Neues Mitglied
Hallo liebe Community,
Ist es möglich, wenn man einen div-Container hat, dessen (automatische) Höhe für einen anderen div-Container als margin verwenden?
Ich möchte nämlich eine fixe (position:fixed) Navigation erstellen die immer mit rutscht, jedoch verdeckt diese den Anfang meiner Seite.
Habe dies bisher mit einem margin (margin-top:50px) gelöst, jedoch ist dies nun nur mehr bei bestimmter Displaygröße empfehlenswert, weil sonst wieder etwas verdeckt wird, oder zuviel Freiraum bleibt.
Hätte mir das so vorgestellt, das man irgendwie die Höhe des div-Containers bekommt 20 Pixel dazu gibt und dies als margin-top verwendet.
Man muss dazu sagen, dass ich lange nach Möglichkeiten via Google gesucht hatte, aber nichts fand. Ich bin auch eher Anfänger.
Freue mich schon auf eure Antworten, DANKE im Voraus! :)

Wenn etwas unklar ist, BITTE fragt - Danke
 
Zuletzt bearbeitet:
hallö,

so was macht man mit jquery.
damit kannst entweder beim erreichen eines divs die flash ändern oder das addon anpassen.
mit jquery hängt gleichzeitig die Browser Größe ermitteln und ab bestimmten Größen hält was.bestimmtes machen oder nicht.

also such mal jquery scroll class ändern.

chefchen
 
Danke für den Hinweis, werde es gleichmal ausprobieren, wobei JQuerry eigentlich eher 2. Wahl ist, denn ich kenne mich damit überhaupt nicht aus und würde es lieber direkt machen. Ich hätte dazu noch eine Frage: Ich habe JQuerry bisher so verstanden, dass es JavaScript Befehle einfacher machen sollte. Dann müsste es doch auch einen direkten JS-Code geben der das kann, oder nicht? Kann aber gut sein, dass ich da was falsch verstanden habe. :)
 
HAllo,

ja, jquery ist nur Javascript.
Aber auch viel mehr, und zwar genau der gegenteil wie du sagst.
1 jquery befehl ersetzt vielleicht 5 Zeilen javascript code oder auch mehr.

klick mal in der Signatur auf den Link und nimm die subdomain mal weg, da siehst zufällig wahrscheinlich genau das was suchst, menü scrollt mit.

Cheffchen
 
jQuery liefert von Hause aus viele Funktionen mit, die man sich mit JS erst erstellen müsste. Damit ist dein Problem recht einfach zu lösen. Denke aber daran, dass der Margin beim Skalieren des Viewports neu berechnet werden muss. Du bräuchtest also auch ein resize() Event.

Pseudocode:
Code:
function fooBar() {
    var foo = $("container_1").height();
    $('container_2').css('margin-top', foo);
}

$(window).on('resize', function() {
    fooBar();
});

fooBar();
 
Ich bräuchte eigentlich einfach nur den JS-Code dafür, wenn es denn nur mit JavaScript geht, denn ich will WIRKLICH auf JQuerry verzichten.
@Cheffchen Ich bräuchte es instant, also ohne flüssiges mitrutschen, halt eben mit position:fixed
 
Ich habe JQuerry bisher so verstanden, dass es JavaScript Befehle einfacher machen sollte.

Aber auch viel mehr, und zwar genau der gegenteil wie du sagst.
1 jquery befehl ersetzt vielleicht 5 Zeilen javascript code oder auch mehr.

Für mich ist da kein Unterschied in euren Aussagen. jQuery macht JavaScript einfacher (oder soll es zumindest). Auch ich verzichte gerne darauf, aus vielerlei gründen um die es hier aber nicht geht.

Mit reinem JavaScript müsstest Du in etwa so arbeiten:

Code:
#deinfixiertesElement {
 position: absolute;
 top: 50px;
}

Code:
if( document.body.scrollTop > 50 ) {
 document.getElementById("deinfixiertesElement").style.position = "fixed";
}

Dadurch wird aus deinem absolut positionierten Element ein fixiert positioniertes Element sobald der Nutzer im Browser 50 Pixel nach unten gescrollt ist.

Ungetestet.

Ein jQuery-Beispiel was man auf reines JavaScript umschreiben kann findest Du hier:
http://www.html.de/css/47025-position-fixed-menue-erst-bestimmter-steller-einblenden.html
 
Zurück
Oben