2

Jqueryを使用して、ホバー時にスライドアップトランジションで画像を変更するにはどうすればよいですか? インターネットで検索しましたが、動作するコードが見つかりません。私が見つけたすべてのコードは、fadeIn または fadeOut を使用しています。どうもありがとうございました!

これは私が見つけたコードですが、フェードインとフェードアウトを使用しています。

<script>
$(function() {
$('.change').mouseenter(function(){
  $(this).slideUp('fast', function(){
    $(this).attr('src', $(this).data('on'));
    $(this).fadeIn();
  });
});

$('.change').mouseleave(function(){
  $(this).slideUp('fast', function(){
    $(this).attr('src', $(this).data('off'));
    $(this).fadeIn();
  });
});
});</script>

および HTML:

<img class="change" src="images/portofoliu/next.gif" data-on="images/portofoliu/prev.gif" data-off="images/portofoliu/next.gif">
4

1 に答える 1

1
<div id="clickme">
  Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123" />

$('#clickme').hover(function() {
  $('#book').slideUp('slow', function() {
    // Animation complete.
  });
});

http://jsfiddle.net/GFdW5/3/

http://api.jquery.com/slideUp/

編集:最終的な解決策: http://jsfiddle.net/hellomynameisluc/frTFw

于 2013-04-13T04:26:03.500 に答える