↓↓ソースです。 ご自由にお使い下さいです。
<div style="width: 1280px;animation: marquee 50s linear 0s infinite alternate;"><div style="width: 1920px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントー!
</div>
</div></div>
↑↑ソースここまで↑↑
「<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
</div>」を増やして色付きの数字を調整するとイラストの枚数が増やせます。
※1920px は640×画像の枚数。(小さな画像は調整が必要だったり余白でごまかしたり。)
※1280px はスクロール距離。1920px から640px引いた数がお勧め。
※50sはスクロール速度。 50秒で1280px動くという意味。
画像枚数に合わせて自力で編集してもらう予定でしたが、思った以上に面倒だったので調整済みの物を用意しました。
↓↓画像2枚用のソース
<div style="width: 640px;animation: marquee 25s linear 0s infinite alternate;"><div style="width: 1280px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像4枚用のソース
<div style="width: 1920px;animation: marquee 75s linear 0s infinite alternate;"><div style="width: 2560px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像5枚用のソース
<div style="width: 2560px;animation: marquee 100s linear 0s infinite alternate;"><div style="width: 3200px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像6枚用のソース
<div style="width: 3200px;animation: marquee 125s linear 0s infinite alternate;"><div style="width: 3840px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像7枚用のソース
<div style="width: 3840px;animation: marquee 150s linear 0s infinite alternate;"><div style="width: 4480px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像8枚用のソース
<div style="width: 4480px;animation: marquee 175s linear 0s infinite alternate;"><div style="width: 5120px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像9枚用のソース
<div style="width: 5120px;animation: marquee 200s linear 0s infinite alternate;"><div style="width: 5760px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑
↓↓画像10枚用のソース
<div style="width: 5760px;animation: marquee 225s linear 0s infinite alternate;"><div style="width: 6400px;text-align: center;">
<div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
イラスト:○○さん
とか書いたり。
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div><div style="width: 640px;float:left;">
■■■ここを画像タグに置き換える■■■
コメントとか書く!
</div>
</div></div>
↑↑ソースここまで↑↑