помогите люди добрые. суть такая, на фоне хочу слайд шоу. сделал вот что
html
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="style.css">
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="js/jquery/slideshow.js"></script>
</head>
<body >
<div class="fadein">
<img src="images/home1.jpg">
<img src="images/home2.jpg">
<img src="images/home3.jpg">
</div>
</body>
</html>
css
|
Код:
|
html {
background: black url(images/home1.jpg) no-repeat top left fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.images/home1.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/home1.jpg', sizingMethod='scale')";
} |
jquery
$(function() {
$('.fadein img').hide();
$('.fadein img:gt(0)').hide();
setInterval(function () {
$('.fadein :first-child').fadeOut()
.next('img')
.fadeIn()
.end()
.appendTo('.fadein');
var imageurl = $(".fadein img").attr("src");
$("html").css("background", "transparent url('"+imageurl+"') no-repeat top left fixed");
$('.fadein img').hide();
}, 4000);
});
слайд шоу работает, правда с недочетами в опере и ie. В опере по началу все хорошо, потом появляется белая страница, а через несколько секунд картинка нужного слайда
Помогите пожалуйста
1) как передать параметр для браузеров через jquery, что бы картинка выводилась на весь экран( для одной картинки через css работает для всех, кроме ie)
2) как настроить плавный переход между слайдами? В первую очередь касается бага в опере
3) и что делать вообще с ie ? слайд шоу не работает вообще.
Буду очень признателен за совет
