Показать сообщение отдельно
  #4 (permalink)  
Старый 09.11.2010, 03:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Вариант на заданную тему )))
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title></title>
<style type="text/css">
#wrapper {
	width: 180px;
	height: 180px;
	background-color: #000000;
}
#content {
  width: 180px;
  height: 180px;
  background-image: url(http://www.buket.co.ua/planet/srez_cvety/____182.jpg);
}
</style>
</head>

<body>
<div id="wrapper"><div id="content"></div></div>


 <script language="JavaScript" type="text/javascript">
function slide(e, b, j, z) {
    e = e||document.getElementById(e);
    if(e.timer) window.clearTimeout(e.timer)
    var a = e.style.cssText;
    for (var d in b) {
        var g = RegExp("(" + d + ".*?)(\\d+\\.?\\d*)", "i");
        g.test(a) ? a = a.replace(g, "$1" + b[d][0]) : d != "opacity" ? a = d + ": " + b[d][0] + "px;" + a : window.ActiveXObject ? a = "filter:progid:DXImageTransform.Microsoft.Alpha(opacity=" + b.opacity[0] + ");" + a : a = "opacity:" + b.opacity[0] / 100 + ";" + a
    }
    e.style.cssText = a;
    var k = (new Date).getTime();
    setTimeout(function () {
        var h = ((new Date).getTime() - k) / j;
        h = h < 0.5 ? Math.pow(2 * h, 3) / 2 : (2 - Math.pow(2 * (1 - h), 3)) / 2;
        for (var c in b) {
            var i = Math.ceil((b[c][1] - b[c][0]) * h + b[c][0]);
            if (c == "opacity" && !window.ActiveXObject) i /= 100;
            var f = RegExp("(" + c + ".*?)(\\d+\\.?\\d*)", "i");
            a = a.replace(f, "$1" + i)
        }
        e.style.cssText = a;
        if (h < 1) e.timer = setTimeout(arguments.callee, 30);
        else {
            for (c in b) {
                if (c == "opacity" && !window.ActiveXObject) b[c][1] /= 100;
                f = RegExp("(" + c + ".*?)(\\d+\\.?\\d*)", "i");
                a = a.replace(f, "$1" + b[c][1])
            }
            e.style.cssText = a;
            z&&z()
        }
    }, 10)
};
var p = {"opacity":[100,0]},
p2 = {"opacity":[0,100]},
content=document.getElementById("content"),
img = ["url(http://img.files.7ja.ru/pics-big/99.jpg)","url(http://www.dostavka-buketov.ru/imag/df156.jpg)","url(http://www.buket.co.ua/planet/srez_cvety/____182.jpg)"]
go=function(){slide(content, p, 4000,function(){content.style.backgroundImage=img[0];img.push(img.shift());slide(content, p2, 3000)})}
</script>
<input type='button' onclick='go()' value='Go' />
</body>
</html>
Ответить с цитированием