0

特定の幅と高さの値を持つ<img id="image" width="500" height="100"/>画像があり、この画像のサイズを新しい値に変更し、この変更を無限に維持したいと考えています。

私.effect()はこのように関数を使用しました..

$( document ).click(function() {
$( "#image" ).effect( "size", {
to: { width: 200, height: 60 }
}, 1000 );
});

残念ながら期間限定の機能のようで、画像が元のサイズに戻ってしまいます。

解決策または役立つチュートリアルは素晴らしいです、ありがとう。

アップデート：

私に何が起こるかについてのフィドル: http://fiddle.jshell.net/SdHGK/

4

4 に答える 4

2 
$(document).click(function() {
  $( "#toggle" ).animate({ width: '200px', height: '60px'}, 1000 );
});
于 2013-09-22T15:35:46.217 に答える
1

サイズごとに 2 つのクラス名を使用してから、クリックしてクラス名を変更することができます。

function changeSize () {
var myId = document.getElementById("Your Id Goes Here");
myId.className="mySecondClassname";
}

Css3でもできます。

#yourImage {
    width:50px;
    height:200px;
    border:solid red 1px;
    transition:what you want to transition Duration; //probably width and height
}

    #yourImage:target {
    width:200px;
    height:400px;
}

クリックしたときに URL に表示されるイメージ コンテナーに「#」記号を追加する必要があります。

于 2013-09-22T17:59:59.070 に答える
1

このようなもの？http://jsfiddle.net/8NdHU/

$('img').on('click', function(){
    $(this).css('width', '200%'); 
});

アップデート

http://jsfiddle.net/8NdHU/1/

$('img').on('click', function(){
    $(this).animate({
        width: '100%'
    }, 5000); 
});
于 2013-09-22T15:19:12.523 に答える
0

これを見てください

$( document ).click(function() {
  $( "#toggle" ).effect( "size", {
    to: { width: 200, height: 60 }
  },'slow', function () {
      $("#toggle").css({'width':'200px', 'height': '60px'});
  });
});

http://fiddle.jshell.net/SdHGK/2/

PS:アイデアはChanckjhの 回答とhttp://jqueryui.com/effect/から取られています。

于 2013-09-22T15:27:47.337 に答える