質問: jQuery初心者です。 Googleで調べまくったのですが、やり方が見当たらず...。皆さん教えて下さい。 既に、CSSでwidthを100pxで設定している要素に対して、 jQueryを使って「"#btn"をクリックすると"#box"の幅が20pxずつ縮小する」 という指示は出来ないものでしょうか。 ``` $("#btn").on("click",function(){ $("#box").css('width', '-20px'); }); ``` では出来ませんでした。(そらそうなんですが、最適なやり方が思いつかず...) 実現したいこととしては、boxの右側から20pxずつ削れていって、 5回クリックすると0pxになるようにしたいのです。 ご協力をお願いしますm(_ _ )m
回答: widthメソッドを呼び出す方法があります。 ``` $("#btn").on("click",function(){ $("#box").width("-=20"); }); ``` または、width内に関数を指定する方法があります。 ``` $("#btn").on("click",function(){ $("#box").width(function(i, w) { return w - 20; }); }); ``` なお、HTMLページロード時にclickイベントの定義を読み込む場合は、 ``` ``` 内にコードを記述してください。 Ref: