トップ/blog/random_image

blog/random_image の変更点


#author("2025-04-20T18:26:44+09:00","default:nemusg.pad","nemusg.pad")
#author("2025-08-24T22:33:49+09:00;2025-04-20T18:26:44+09:00","default:nemusg.pad","nemusg.pad")
#title(背景画像をランダムに変える)

このブログでも過去にrotate.phpを使っていました。jQueryで実現することもできるみたいです。jQuery版はファイルの場所を明示しないといけないので、フォルダにまとめて入れておくだけでいいrotate.phpも使いやすい。

** jQuery版 [#w439cb6a]

- [[jQuery で画像をランダムに出力する方法:http://www.webantena.net/javascriptjquery/jquery-random-images/]]

#code_x{{
<script src="./jquery.min.js"></script>
<script>
$(function() {
	var array = [
	"images/01.jpg",
	"images/02.jpg",
	"images/03.jpg"
	];
	var l = array.length;
	var r = Math.floor(Math.random()*l);
	var bgimgurl = array[r];
	$("body").css('background-image',('url("'+bgimgurl+'")'));
});
</script>
}}

** php版 [#r12dfda5]

- [[Random Image Rotation:http://alistapart.com/article/randomizer]] の「PHP source right here」からダウンロードしたテキストを、rotate.phpとして保存して使う。rotator.phpと同じフォルダ内にある画像がランダムに表示されるので、rotateフォルダを作成して隔離するのが楽。
- [[Random Image Rotationを使って簡単に背景画像をランダム表示させる - かちびと.net:http://kachibito.net/web-design/random-image-rotation.html]]

#code_x{{
body {
background-image: url(rotator.php);
}
}}


#include(parts/feedback,notitle)