●やりたいこと
webページの背景画像を数秒ごとに変わるような仕様にしたい。

●準備
画像ファイルimagesを作りその中にback1.png,back2.png,back3.pngを入れる。
html/cssで基本的なページを作る。

以下cssとhtmlとjsの記述。
htmlでjqueryをインポートするのを忘れない。

html

[html]
<script type=”text/javascript” src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js”>
</script>
[/html]

css

[css]
body{
width: 100%;
height: 100%;
background: url(“../images/back1.png”) no-repeat fixed center center;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}
[/css]

javascript

[js]
$(function() {
var i = 1;
setInterval(function() {
if(i > 3) i = 1;
$(“body”).css(“background”,”url(‘./images/back”+i+”.png’) no-repeat fixed center center”);
i++;
}, 4000
);
});
[/js]