0

だから私はjqueryスライドを使ってこの種の「スライドショー」を作ろうとしています。今はホバーすると画像がスライドするようになっていますが、ユーザーが画像にホバーしていない場合は、常に画像の1つを拡大したいと思います。

ライブビューが必要な場合は、テストページhttp://www.johnnyedick.com/indexSlideUpTop.htmlへのリンクを次に示します。

これが私が使用しているjqueryです：

$(function() {

                $('#box1').hover(function() {
                    $(this).stop().animate({ "width" : "530px"}, 1000);
                }, function() {
                    $(this).stop().animate({ "width" : "100px"}, 1000);
                    });

                    $('#box2').hover(function() {
                    $(this).stop().animate({ "width" : "530px"}, 1000);
                }, function() {
                    $(this).stop().animate({ "width" : "100px"}, 1000);
                    });

                    $('#box3').hover(function() {
                    $(this).stop().animate({ "width" : "530px"}, 1000);
                }, function() {
                    $(this).stop().animate({ "width" : "100px"}, 1000);
                    });
            });

ありがとう

4

3 に答える 3

1

簡単な関数を作成しました：http：//jsfiddle.net/skip405/9NVWt/2/。おそらくそれは役に立つでしょう。jQueryの経験が豊富な人なら、さらに完成させることができると思います。私は初心者です。

于 2012-04-28T20:29:21.883 に答える
0

更新しました：

    $(function() {
    $('#box1, #box2, #box3').hover(function() {
        $(this).stop().animate({ "width" : "530px"}, 1000)
            }, function() {
                $(this).stop().animate({ "width" : "100px"}, 1000);
                   }).mouseleave(function(){
                     jQuery.fx.off = true;
                         });
于 2012-04-28T19:58:12.823 に答える
0

ホバー機能コードの後に​​、このコードを追加します

$('#box3').css('width','530px') ;

ページが来るとき3番目のdivが通常のサイズを示している

于 2012-04-28T20:21:45.790 に答える