tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
4
ZUGRIFFE
1260
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Frozenlife Tutorials.de Gastzugang
    Hallo,

    ich habe auf meiner Homepage jetzt einmal eine div (später mehrere) die ich dynamisch via Javascript aktualisiere per Button klick. Ich hole mir mittels Ajax die neuen Daten vom Server und gib überschreib dann den Inhalt der div mittels:

    document.getElementById('login_form').innerHTML = new_content;

    new_content ist der neue Inhalt. Wie kann ich das jetzt so machen, dass ich den alten Inhalt, langsam durch den neuen Inhalt überblende? Also zurzeit ist auf Knopfdruck der neue Text da durch die Zuweisung, aber wie bekomme ich den Effekt zustande? Ich kann eine komplette div entweder langsam sichtbar oder unsichtbar machen, aber das Überlappen schon gar nicht und dann noch mittels innerHtml ...

    Kann mir dabei bitte jemand weiterhelfen?

    Danke schon einmal!!

    mfg
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    schau dir hierfür beispielsweise mal .fadeIn(), .fadeOut(), oder .fadeTo() an.

    mfg Maik
     

  3. #3
    Avatar von Sven Mintel
    Sven Mintel Sven Mintel ist offline Mitglied
    Registriert seit
    Aug 2003
    Beiträge
    18.238
    Blog-Einträge
    6
    Moin,

    nehme 2 Divs, eines für den alten Text, eines für den neuen.

    Beide Divs platziere in einem gemeinsamen Eltern-Div, dem du die CSS-Eigenschaft position:relative gibst.

    Den beiden Divs im Eltern-Div gebe die CSS-Eigenschaften position:absolute;top:0

    Dadurch hast du schon mal die überlappenden Divs.
    Du kannst jetzt eines oder beide blenden, oder die Schichtposition ändern.
     

  4. #4
    Avatar von one6666
    one6666 one6666 ist offline Mitglied Titanium
    Registriert seit
    Jan 2010
    Ort
    Nordrhein-Westfalen
    Beiträge
    175
    Blog-Einträge
    1
    Ich würde auch mit 2 Divs arbeiten, der alte Div in dem der Inhalt steht ist sichtbar, und der neue Div ist auf dem alten aber noch unsichtbar (display:none; ),
    sobald dann readyState den Wert 4 erreicht hat,
    würde ich mit einen Zähler( http://aktuell.de.selfhtml.org/artik...ascript/timer/ ) den alten Div in seiner Transparenz runterzählen lassen, und bei 50% den neuen Div der noch unsichtbar ist wieder sichtbar machen,
    und dann von 0% hochzählen lassen,
    so erreichst du einen perfekten Übergang

    Zusatz:
    Wenn der neue Div unter dem Alten liegt, und readyState den Wert 4 erreicht hat, kannst du den neuen Inhalt dem Div zuweisen und den alten Div in seiner Transparenz von 100% auf 0% zählen lassen,
    der User merkt da keinen unterschied, so mache ich es bei einer Bilder Galerie wo die Bilder sich auch gnaz sanft überlegen sollen.
    Geändert von one6666 (06.02.10 um 23:25 Uhr)
     

  5. #5
    Frozenlife Tutorials.de Gastzugang
    Danke einmal . Hat ziemlich gut geklappt!

    mfg
     

Ähnliche Themen

  1. Buchstabenabstand bei dynamischen Texten
    Von mariomartic im Forum Flash Plattform
    Antworten: 1
    Letzter Beitrag: 25.09.07, 16:18
  2. Antworten: 8
    Letzter Beitrag: 12.05.07, 00:43
  3. Antworten: 10
    Letzter Beitrag: 21.03.07, 13:33
  4. layouten mit dynamischen DIVs
    Von kri im Forum CSS
    Antworten: 1
    Letzter Beitrag: 01.07.04, 10:03
  5. [MX] Kantenglättung bei dynamischen Texten
    Von BenFish im Forum Flash Plattform
    Antworten: 10
    Letzter Beitrag: 14.01.03, 09:51