Ausgetauschtes Bild wird beschnitten dargestellt

[rocksteady]

Hallo allerseits

Ich habe diese Frage schon in anderen Foren gestellt, habe aber leider nie eine Antwort erhalten. Ich hoffe Ihr könnt mir dabei auf die Sprünge helfen..

Ich erstelle zur Zeit eine kleine Homepage für einen Freund von mir und wollte auf der Teamsite alle Personen verlinken. Beim hover über den Namen wird mittels jquery eine neue src in das headerimage-feld geschrieben.
Das Austauschen der Bilder funktioniert eigentlich einwandfrei, jedoch werden die animierten gifs, die geladen werden, beschnitten dargestellt.

Nun suche ich die Quelle für das Problem. Die animierten gifs kann ich ausschliessen, da ich das bereits mit anderen animierten dateien probiert habe und es sich dort gleich verhält.

Hat jemand von Euch eine Idee ob das ein JS oder ein jquery-Problem ist oder dies gar mit dem Browser zu tun hat? (verhält sich unter IE genauso wie auf FF)

Das aktuelle Beispiel finder Ihr auf der Homepage. Die ist noch nicht fertig, das Problem ist dort aber bereits sichtbar.

Der Code sieht ungefähr so aus:

   1. $(function(){  
   2.     $(".link1").mouseover( function(){  
   3.         $('.imagefield').attr('src', '/drupal/sites/default/files/link1.gif');  
   4.         $('.imagefield').attr('height', '350');  
   5.     });  
   6.     $(".link2").mouseover( function(){  
   7.         $('.imagefield').attr('src', '/drupal/sites/default/files/link2.gif');  
   8.         $('.imagefield').attr('height', '350');  
   9.     });  
  10.     $(".imagefieldlink").mouseout( function(){  
  11.         $('.imagefield').attr('src', 'http://www.orthomeier.ch/drupal/sites/default/files/Blume.jpg');  
  12.         $('.imagefield').attr('height', '500');  
  13.     });  
  14. });

~~~html

1. <img class="imagefield imagefield-field_image" src"headerimage.jpg" />
      2. <a href="#" class="link1">link1</a>
      3. <a href="#" class="link2">link2</a>

  
Ich wäre unendlich dankbar wenn jemand seine Meinung dazu äussern könnte.  
  
lg  
Manuel