jQueryでCSSを設定する際、
$("div").css("プロパティ","値");
とすると思いますが、この値の部分に変数を利用することはできないのでしょうか。
何がしたいかというと、for文の中で乱数を発生させ、それを値として使いたいのです。
for(i=0; i<10; i++){
var num = Math.floor(Math.random()*100);
$("div:eq(i)").css("width",num);
}
このように書いてみましたが駄目でした。
値に変数を使う方法はありませんでしょうか。
できない場合、このような方法(CSSの値に乱数を使う)を実現できる方法はありませんでしょうか。
No.1ベストアンサー
- 回答日時:
こんにちは。
もちろん変数で設定することできますよ。
$('div#test div').each ( function(i) {
var num = Math.floor(Math.random()*100);
$(this).css ( 'width', num );
});
これで実験しましたが、きちんと反映されていました。
<div id="test">
<div>a</div>
<div>b</div>
<div>c</div>
<div>d</div>
</div>
セレクタ部分の指定が
$("div:eq("+i+")").css("width",num);
ではないでしょうか。
iを変数として扱ってあげないといけません。
まさに仰るとおりでした!
"div:eq("+i+")" にしたところ機能しました。
初歩的なミスでお恥ずかしい;;
ありがとうございました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- PHP アップロードファイルの数に応じてCSSを動的に変更したいのですが、方法がわかりません 3 2023/07/23 21:59
- HTML・CSS htmlとcssで吹き出しの中に文字を置きたいのですが、 html 〈div class bb〉 〈 3 2023/02/04 22:44
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript jQueryでのレスポンシブが綺麗に動かない 3 2022/06/21 11:08
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
動画の上に広告をオーバーレイ...
-
時間帯によってclass名を変更し...
-
CSSでreadonlyの機能はあり...
-
macかwinか判別しスタイルシー...
-
javascriptでの(-)ハイフンの処...
-
3重のクォーテーション
-
Q&A掲示板の入力フォームに文字...
-
ポップアップのリンク先と閉じ...
-
JspにIf条件を追加したいのです...
-
formのsubmitを押すとモーダル...
-
「ご処理進めて頂きますようお...
-
エクセルで、日付を入力すると...
-
EXCEL VBA マクロ 実行する度に...
-
Excelシート上のマクロを登録し...
-
CloseとDisposeの違い
-
【Excel】特定の文字を含むセル...
-
エクセルVBAで、MsgBox やInput...
-
switch の範囲指定
-
VBAでループ内で使う変数名を可...
-
DoEventsがやはり分からない
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Q&A掲示板の入力フォームに文字...
-
JavascriptでDom XSSの脆弱性対...
-
【JavaScript】検索がヒットし...
-
CSSでreadonlyの機能はあり...
-
JavascriptでXSSの脆弱性への対...
-
formのsubmitを押すとモーダル...
-
確認ダイアログを次からは表示...
-
特定の条件のHTML要素を一括で...
-
JavascriptのHTMLクラス表示に...
-
jQueryでのドラッグアンドドロ...
-
javascriptで複数の表示・非表...
-
jqueryを使ったスムーススクロ...
-
javascriptのエラーで質問です。
-
jqueryアコーディオンの上部の...
-
JavaScriptのdiv.style属性の変...
-
2回目以降のページロード時には...
-
改行をしたいが、<br>と...
-
jQueryのCSSで値に変数を使う方法
-
クリックすると、色が変わるよ...
-
動画の上に広告をオーバーレイ...
おすすめ情報