nicht angemeldet
ich bin jetzt schon länger dabei, den Text im unterem Code zum Laufen zu bringen, also der Text sollte sich nach unten bewegen und die Zeilen, die untern verschwinden, sollten oben wieder erscheinen.
Das was du bisher gemacht hast - nebst der syntaxfehler - sorgt bestenfalls dafür (wenn du es richtig machst) dass sich der komplette Kasten (wo auch immer er steht) irgendwohin verschiebt und seinen Außenabständ ändert, zusätzlich ändert er seine Deckkraft. In Summe dauert das 5,5 Sekunden.
Weiß jemand, wie ich das machen kann. Ich hab es mit unterem Code mal versucht, aber leider ohne Erfolg.
Wie wäre es mit Hirn und Versand zu arbeiten und nicht einfach irgendwas auszuprobieren?
[code lang=html]
Da fehlt der Doctype.
1.<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
Dein Text ist offensichtlich nicht in der Sprache en-us verfasst, er ist eindeutig deutsch.
<head>
<script type="text/javascript" language="javascript" src="jquery-1.4.4.min.js"></script>
Das language-Attribut ist überflüssig.
<script type="text/javascript">
function functionTest() {
$("#infoText").animate({
top: "+=80%",
+=80% ist kein gültiger Wert für top
marginTop: "0.6in", opcaity: 0.9 },5500);
Inch, bist du dir sicher?
}
</script>
</head>
<body>
<div id="infoText">
asdasdfadsf<br />
asdfasdf<br />
asdfasfa<br />
asdfasdf<br />
adfasdfas<br />
asdfasdf<br />
asdf<br />
asdfasd<br />
fadf
</div><input type="button" name="Text 2" value="Text 2 anzeigen" onclick="functionTest()">
Wie wäre es, wenn du die events anhängst jQuery stellt hier bind() zur Verfügung. Ein onclick-Attribut ist nicht sinnvoll.
Schritt 1: bevor du irgendwas mit jQuery oder JavaScript machst: bau dir ein ordentliches, valides HTML-File mit ordentlichem Code. Eine unsortierte Liste anstatt einer div-Suppe ist für dein vorhaben empfehlenswert.
Schritt 2: formatiere dieses HTML mit CSS so, dass es statisch passt.
Schritt 3: überlege, was passieren muss, dass du das Gewünschte erreichst
Etwa so:
a) Oberstes Element in der Liste wird z.B. mit einem negativen Margin um seine eigene Höhe nach oben verschoben und gleichzeitig auf auf 0 opacity reduziert
b) Oberstes Element (nunmehr unsichtbar) wird aus dem DOM-Entfernt, sämtliche Eigenschaften für das nunmehr neue oberste Element werden sofort auf die Standardwerte zurückgesetzt
c) Das Vormals oberste Element wird unten in das DOM-eingehängt, auf Standardvorgaben zurückgesetzt (außer opacity) und dann auf opacity 1 zurückanimiert.
d) Starte erneut bei a)
Schritt 4: erstelle einzelne CSS- und HTML-Schnipsel für die Zwischenschritte deiner Animation
Schritt 5: sorge dafür, dass diese Schnipsel durch eine Animation oder vergleichbares ersetzt werden.
Gunnar Bittersmann