背景に画像をフルに表示させてフェードで入れ替えるのはいくつかあったけど、左右にスライドさせたかった。
そして、それはあくまで背景として、上にはちゃんとテキストなど表示させたかった。
前にも書いた、Fotoramaがすごくいろんなオプションがあって、カスタマイズできるので、これを使います。
http://fotorama.io/
ちょー簡単なスクリプト。
そして、それはあくまで背景として、上にはちゃんとテキストなど表示させたかった。
前にも書いた、Fotoramaがすごくいろんなオプションがあって、カスタマイズできるので、これを使います。
http://fotorama.io/
ちょー簡単なスクリプト。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<link href="fotorama.css" rel="stylesheet">
<script src="fotorama.js"></script>
<script>
$(function(){
$('.fotorama').fotorama({
width: '100%',
height: '100%',
fit: 'cover',
nav: 'none',
margin: 0
});
});
</script>
</head>
<body>
<style>
body{
margin: 0;
padding: 0;
}
.fotorama{
margin: 0;
padding: 0;
width: 100%;
height: 100%;
position: absolute;
z-index: -999;
}
</style>
<div class="fotorama">
<img src="001.jpg">
<img src="002.jpg">
<img src="003.jpg">
<img src="004.jpg">
<img src="005.jpg">
</div>
ここに文字がかけるよぉー♪
</body>
</html>
これでおk！
これでおk！