[Paul_Tergeist]

hi leute,

ich habe folgendes problem:
ich möchte ein bild, dass ich per .after einfüge, erst einfaden und dann wieder ausfaden.

das einfügen klappt erstmal problemlos über
$(this).after('<img src="img/img.png" class="icon">');

wenn ich aber nun im anschluß
$('img.icon').fadeIn(2000).fadeOut(2000);
ausführe, kommt nur das .fadeOut (das bild startet nach dem
einfügen durch .after direkt mit voller sichtbarkeit.)

hätte da jemand einen tipp für mich, wie ich das lösen könnte?

[DerM]

Du brauchst einen Delay

[sahnemuh]

Oder du nutzt einfach einen Callback

$('img.icon').fadeIn(2000,function(){
$(this).fadeOut(2000);
})

[choise]

ich glaube er meint was anderes, da er das element dynamisch einfügt.

eine möglichkeit wäre zb: http://jsfiddle.net/a5Xgw/

[Paul_Tergeist]

danke für eure tipps!

ich habs aber dann doch anders gelöst: ich habe der klasse img.icon von vornherein "display: none" verpasst.
so startet das icon direkt versteckt, und das .fadeIn greift.

die variante von choise funktionierte zwar auch, aber da ist das problem, dass jQuery dem erstellten img "display:block" verpasst, was mir das layout verschiebt :-/

sahnemuh: deine variante führt zum gleich ergebnis wie mein ansatz. aber da das img immernoch eingeblendet startet greift auch da das .fadeIn nicht

DerM: der .delay hift da auch nicht

[DerM]

[pantonine]

Davon abgesehen, warum sich mir nicht erschließt, wieso Du das Bild über .after erzeugst, würde ich es so machen:

http://jsfiddle.net/3njsU/

Callback ist schon die richtige Variante. Im Ggs. zu Spielchen mit delay wird hier sichergestellt, dass das Fadein abgeschlossen wurde.