FadeIn / FadeOut JavaScript

[steffi]

Hallo,

ich habe einen Formular-Button, welcher einen Ajax-Request an ein PHP-Script sendet.

Nun möchte ich, dass beim Klick auf den Button nicht nur der Request abgesetzt wird, sondern gleichzeitig ein DIV mit einer Meldung erscheint (Request wird verarbeitet oder ähnliches). Danach soll das DIV wieder verschwinden.


Ich habe eine Lösung mittels Mootools, aber das ist zum einen recht heftig (7000 Zeilen Code) und zum anderen meckerts dann:

Meldung: Objekt erwartet
Zeile: 76
Zeichen: 1
Code: 0
URI: domain.com/ajaxtest.html


Hat jemand von euch eine einfache Lösung (möglichst ohne fremde Frameworks), die ein Ein- & Ausblenden eines DIV-Containers ermöglichen?

Button gedrückt -> DIV FadeIn (+ Request abesetzen <-- Code hab ich selber, funktioniert)
Danach FadeOut


Wäre euch sehr dankbar.


Gruß Steffi

 

[lerel]

Das sind keine 10 Zeilen Code...

Mittels jQuery:

CODE
$.ajax({
async:false,
type:   'POST',
url:    'deine url zu deinem script...',
data : 'deien daten die geschickt werden sollen....',
beforeSend: function(){
 $('#fadeContainer').fadeIn('fast');
},
success:  function(response) {
 $('#fastContainer').fadeOut('fast');
}
});



Da ich früher selbst mit MooTools gearbeitet habe weiss ich das man das ganze auch dort so umsetzen kann.

EDIT: Entsprechend den dort verwendeten Befehlen und Variablen, vom Umfang allerdings gleich...

EDIT 2: Binde das Framework über Google's CDN ein, dann hast du a) keine Traffic Kosten und b) ist es sehr wahrscheinlich das das Framework durch eine andere Seite schon geladen wurde und im Cache des Browsers liegt

 

[nitrit]

gar kein framework? Wie du siehst geht sogar AJAX mit JQuery supereinfach. Hab früher auch alles selber geschrieben von Fading bis Drag'n'Drop, aber: Wenn was nicht geht muss man alles anpassen v.a. ist dann noch nicht gesagt, dass es auch in anderen Browsern funktioniert