jqueryで.clickで横にスライドしながら表示されるボックスのメニューを作成しました。
$(function(){
$("#button").click(function(){
$('#box').toggle('slide',{ origin: ['top','left'] }); return false;
});
});
これで意図した動きはしているのですが、更にfadeを加えてスライド表示される際に
透明度を0から1にしたいのですが、どのように処理をすれば良いのかわかりません。
スライドの処理とわけてしまうと完全にスライドした後にfadeの処理が行われてしまいます。
スライドしながら透明度も変更するにはどうすれば良いのかどなたかご教示お願います。
No.1ベストアンサー
- 回答日時:
手元のjquery(1.4.2)だと動作しないみたいですが、何か別にプラグインを利用しているのでしょうか?
(最新版はv1.5みたいなので、機能が変わったのかな…)
toggle()はもともと透明度も操作するようになっているみたいなので、durationを指定してあげれば透明度も変化するはずですが?(同時に縦横とも変化しますが)
$('#box').toggle(2000);
http://api.jquery.com/toggle/
あるいは、widthだけ伸び縮みして透明度も変化するのならanimateを利用して
$('#box').animate({ width:'toggle', opacity:'toggle' },1000);
http://api.jquery.com/animate/
とか…
jqueryをあまりよく知らないので、ご提示の指定方法についてはわかりません。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- JavaScript jQueryでのレスポンシブが綺麗に動かない 3 2022/06/21 11:08
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- PowerPoint(パワーポイント) パワーポイントのアニメーションについて 4 2023/06/14 16:25
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- Visual Basic(VBA) PowerPoint VBA で画像の鮮明度を変更する方法がわかりません 2 2023/03/24 13:34
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- Google Drive Googleスライドについて 1 2023/05/01 00:11
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
背景画像のスライドショー
-
マイページはどこを開くの
-
ウインドウを毎回同じ位置、大...
-
デジタル時計の時刻合わせの方...
-
エクセルのシート上に別のシー...
-
Javascript_submit()完了後に処...
-
エクセルVBAでフォームのListbo...
-
[Java] Edgeでのアドレスバー非...
-
一定時間おきにアラームやポッ...
-
Excelでワードアートや図を常に...
-
ポップアップウィンドウがブロ...
-
Excel操作 ウィンドウで出した...
-
同じページをブラウザで複数開...
-
VBAで任意のウインドウのサイズ...
-
VBA ポップアップが表示された...
-
【Android】ユーザー補助機能ボ...
-
子→親ウインドウへデータを受け...
-
別フォームから戻ったときのイ...
-
VBの画面で、全ウィンドウを一...
-
リストビューをスクロールさせ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
prototype.jsとjquery.jsの併用...
-
1ページ内に複数のjqueryのスラ...
-
jQueryでclientWidthが使えない
-
クリックで卵がパカっと割れる...
-
クリックすると画像が飛び出て...
-
jQuery1.3.2を使用しています。
-
jquery画像ビューアー(IE6対応)
-
背景画像のスライドショー
-
jquery UIのdatepickerで和暦
-
jqueryのプラグインdroppy.jsに...
-
IE8のJavascriptアコーディオン...
-
既に複数行あるフォームの項目...
-
マイページはどこを開くの
-
デジタル時計の時刻合わせの方...
-
ウインドウを毎回同じ位置、大...
-
エクセルのシート上に別のシー...
-
一定時間おきにアラームやポッ...
-
Excelでワードアートや図を常に...
-
Javascript_submit()完了後に処...
-
エクセルVBAでフォームのListbo...
おすすめ情報