どうも、みつです。
突然ですが、なんとなくアイキャッチつけました。
実は、投稿初期は自作で画像作ってまで設定してたのですが、
記事を書く前に、画像作成で燃え尽きがちだったのでやめてました。
では、本題です。
実現したいこと
アクセスの度に画像をランダム表示させたい。
用途
・サイトトップ メインビジュアルの画像をランダムで切り替えたい。
・コンテンツをランダムに切り替えたい
など
サンプルコード
HTML
|
1 |
<img id="randomImg" src="image01.jpg" alt="hoge"> |
JS
|
1 2 3 4 5 |
var images = [ 'image01.jpg', 'image02.jpg', 'image03.jpg' ], // ランダム表示させたい画像のパス number = Math.floor(Math.random() * images.length), // 0~2の数値を算出 selectedImg = images[number]; // 算出された数値を元に、1行目の配列から取り出す $('#randomImg').attr('src', selectedImg); // id="randomImg"のsrcを書き換える |
以上です
