![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
ちょっと変わったスライドショーを作りたいのですが、
自分の技量では仕組みを考えつくことが出来ず、困っております。
どなたか下記のものが出来る仕組みをお教え頂けないでしょうか。
合計6枚のスライドショーです。
Aパート
・1枚目 固定でA.jpgを表示
・2枚目、3枚目はB-1、B-2、B-3、B-4.jpgから2枚をランダムに表示
Bパート
・4枚目 固定でC.jpgを表示
・5枚目、6枚目はD-1、D-2、D-3、D-4.jpgから2枚をランダムに表示
※Bパートの6枚目のあとはAパートの1枚目に戻りリピート再生です。
※2巡目以降、ランダム表示で1巡目と同じ画像が出ても構いません。
※jquery-cycleのように指定した時間で画像を切り替え(切り替わり時にフェードイン、フェードアウト)
言葉にするのが難しいので、図をかいてみました。
なんとも手間がかかる仕様で申し訳ございません。
どなたかご教授をお願い致します!!
![「ちょっと変わったスライドショーを実現した」の質問画像](http://oshiete.xgoo.jp/_/bucket/oshietegoo/images/media/e/377928_5497d2c559fb4/M.jpg)
No.1ベストアンサー
- 回答日時:
1枚の画像が順次変わるタイプのスライドショーで、1~6で1サイクルとして、1番目、4番目は常に固定画像、2、3番目はB1~B4の画像から、5、6番目はD1~D4の画像から選択されるという意味でしょうか?
>仕組みを考えつくことが出来ず、困っております
とのことなので、仕組みの一例を…
var imgA = ["A.jpg"],
imgB = ["B1.jpg","B2.jpg","B3.jpg","B4.jpg"],
imgC = ["C.jpg"],
imgD = ["D1.jpg","D2.jpg","D3.jpg","D4.jpg"];
のように画像データを定義しておいて、これとは別に表示順のデータを、
var cycle = [imgA, imgB, imgB, imgC, imgD, imgD];
などのようにしておけば、
あとは『cycleの示す順に指定された配列からランダムに1つ選んで表示する』という処理ですむと思いますけれど。
(imgAとimgCは要素が1つしかないので、固定と同じことになる。)
画像の切替えや、フェードイン/アウトはお好みでどうぞ。
ありがとうございます。
教えて頂いた方法を参考に思っていた順序で表示するところまで出来ました。
フェードインアウトについては、手こずっておりますが(泣)
頑張って残りを完成させたいと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 画像が分割されて切り替わる、ループアニメーションが作りたい 7 2023/05/27 17:12
- Excel(エクセル) excelvbaでスライドショーを作りたい 2 2023/04/20 14:32
- 数学 数学A、確率の問題です。 nを4以上の自然数とする。数字の1からnが書かれたカードが1枚ずつ、合計n 3 2023/07/02 22:54
- 数学 相変わらずヘッタクソ!! A君とB君はコインを1枚ずつ投げ、2枚とも表あるいは2枚とも裏が出れば投げ 5 2023/02/06 13:35
- Microsoft ASP LEDで電光掲示板に「A B C D E」と表示したいのですが・・・ 1 2023/07/04 07:37
- 統計学 確率の問題です。 7 2022/05/07 01:08
- C言語・C++・C# カードシャッフルのブログラムを使ってc言語でブラックジャックをしたい 2 2022/04/12 15:13
- CPU・メモリ・マザーボード メモリの増設について 6 2022/12/28 06:41
- 数学 A君とB君はコインを1枚ずつ投げ、2枚とも表、あるいは2枚とも裏が出れば、投げた2枚をA君がもらい、 3 2023/02/05 12:19
- Excel(エクセル) 荷捌作業効率をあげるためのエクセル関数を教えてください。 8 2022/10/07 08:17
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画像をクリックしてその地点の...
-
USEMAPでの指定区域にマウスオ...
-
ボタンをクリックした時に、キ...
-
画像を切り替えランダム表示
-
「画像の上を流れる文字列」を...
-
画像をフォルダに入れれば表示...
-
画像のランダム表示が遅い?
-
Javascriptで指定した日付と時...
-
【java】背景画像を一定時間で...
-
スワップイメージが上手く動作...
-
HTMLで条件分岐はできますか?
-
【スマホ】画像ボタンを押した...
-
小窓について教えて下さい。
-
ちょっと変わったスライドショ...
-
JavaScriptとチェックボックス...
-
1枚の画像をクリックして複数の...
-
MAX関数を使ってからLEFT JOIN...
-
createElementで作成した要素を...
-
読み込んだQRコードをフォーム...
-
jqueryのsortableで一部ソート...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
Gifアニメ、最後のコマに行った...
-
透過pngの透明部分以外をクリッ...
-
JavaScript スライドの画像にリ...
-
1枚の画像をクリックすると複数...
-
Javascriptで指定した日付と時...
-
ボタンをクリックした時に、キ...
-
1枚の画像をクリックして複数の...
-
オンマウスで、画像切り替え+...
-
画像の重なりの順序を代える方...
-
javascriptで毎月替わる画像
-
【java】背景画像を一定時間で...
-
jQueryスライドショー画像への...
-
JavaScriptとチェックボックス...
-
画像がプルプルふるえるんです。
-
HTMLで条件分岐はできますか?
-
中心を軸にくるくる回るjQuery ...
-
WEBページ立ち上げ時に1回のみ...
-
プルダウンの位置がwin/macでず...
-
bxsliderにて読み込み後に内容...
おすすめ情報