<div> austauschen, ohne aboslute Positionierung

  • Hallo,


    ich bräuchte mal bitte eure Hilfe / Ratschlage.
    Ich erstelle gerade eine Seite bei der bei Rollover eines Divs dieser ausgeblendet und ein anderer eingeblendet werden soll (der zweite soll also den ersten ersetzen). Da diese Elemente aber nicht fest an einer Stelle sind, kann ich die divs nicht direkt mit absoluter Positionierung übereinander platzieren. Meine Idee war es jetzt, mit jQuery, das eine div durch das andere mit replaceWith() zu ersetzen. Allerdings ist das zweite div etwas umfangreicher mit Text und Bild. Daher bin ich mir nicht so sicher, ob das eine gute Lösung ist. Was meint ihr? ODer habt ihr eine andere Idee, auf die ich nicht komme....
    Ach ja, es ist nicht nur ein solches div das durch ein anderes ersetzt wird, sondern mehrere.
    Vielen Dank schonmal
    lg Nadja

  • kannst du das irgendwie codemäßig mal zeigen?
    was spräche dagegen nur ein div zu nutzen und den inhalt schlichtweg zu tauschen? oder beide divs in einem wrapper zu halten und des eine auszublenden und das andere einzublenden? oder eben tatsächlich mit absoluter pos aber via javascript gelöst? es gibt viele wege, aber ohne design oder code zu sehen (am besten nen link oder so) is alles nur rein spekulativ

  • Danke für deine Antwort.
    Hier ist ein Link zur SEite (funktioniert aber noch nicht alles!): http://playground.lamisch.de/fuxdesign/
    Benutzer: CWilke
    PW:Fuxdesign
    Es geht zum einen um die Bilder die gleich oben zu sehen sind. Da soll der TExt eigentlich erst auf Mouseover erscheinen und dafür das Bild "verschwinden". Und zum anderen geht es um den Bereich "Netzwerk". Also um die Fuxköpfe. Da soll auch bei Mouseover der Kopf verschwinden und dafür der Infokasten eingeblendet werden.


    Danke schonmal
    lg NAdja

  • Ok habs mir nun angesehen, was spricht beim netzwerken dagegen einen container für das flow-layout zu nehmen und die einzelnen füchse, wie auch ihre texte darin zu verorten?


    der wrapper bekäme dann ein pos: relative, die füxxe und die texte zu jedem einzelnen absolut positioniert, das ein- und ausblenden is dann ja via jQuery kein act (dazu als tip: animate auf die opacity statt fadein und fadeout zu nutzen, es kann unschöne sprung-effekte geben, weil fadein und fadeout mit display:none arbeiten ;) )



    indexpage:
    gleiches spiel:
    box-ref-kl wird mit position: relative verzaubert und alles was dann da drin liegt kann eben via pos absolute entsprechend ein und ausblenden.
    bzw gehts noch hübscher, wenn die info in einem hidden container liegt und man via mouseover einen eizelnen container an die maus klebt und dort werden bei mouseover nur die infos eingeblendet, die im hidden container sind.



    alles in allem is des in wenigen std erledigt :)