Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Запуск скрипта после загрузки страницы (https://javascript.ru/forum/dom-window/5180-zapusk-skripta-posle-zagruzki-stranicy.html)

vital8 23.09.2009 23:47

Запуск скрипта после загрузки страницы
 
Данный скрипт плавно изменяет прозрачность картинки при наведении мышки. Подскажите, пожалуйста, что нужно сделать, чтобы прозрачность картинки плавно изменялась после перезагрузки страницы.

Замена строчки
new Animator(document.getElementById('animated'), 0.2, 50).process('mouseover', 'mouseout');

на строчку
new Animator(document.getElementById('animated'), 0.2, 50).process('load', '');
не помогает


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript">
window.onload = function() {
 
    function Animator(node, initialOpacity, speed) {
        this.node = node;
        this.opacity = this.initialOpacity = initialOpacity;
        this.speed = speed;
        this.flagIn = false;
    }
 
    Animator.prototype = {
        bind: function(type, listener) {
            if(this.node.addEventListener) this.node.addEventListener(type, listener, false);
            //@cc_on this.node.attachEvent('on' + type, listener);
        },
        process: function(type1, type2) {
            var _this = this;
            this.bind(type1, function() {
                _this.flagIn = true;
                _this.fadeIn();
            });
            this.bind(type2, function() {
                _this.flagIn = false;
                _this.fadeOut();
            });
        },
        setOpacity: function() {
            this.node.style.opacity = this.opacity;
            //@cc_on if(@_jscript_version < 5.8) this.node.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=' + (this.opacity * 100) + ')';
        },
        fadeIn: function() {
            var _this = this;
            setTimeout(function() {
                if(_this.opacity < 1 && _this.flagIn) {
                    _this.setOpacity(_this.opacity += 0.1);
                    _this.fadeIn();
                }
            }, this.speed);
        },
        fadeOut: function() {
            var _this = this;
            setTimeout(function() {
                if(_this.opacity > _this.initialOpacity) {
                    _this.setOpacity(_this.opacity -= 0.1);
                    _this.fadeOut();
                }
            }, this.speed);
        }
    };
 
    new Animator(document.getElementById('animated'), 0.2, 50).process('mouseover', 'mouseout');
 
};
</script>
<style type="text/css">
#animated {
opacity: 0.2;
}
</style>
<!--[if IE]>
<style type="text/css">
#animated {
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
}
</style>
<![endif]-->
</head>
 
<body>
    <img id="animated" src="" alt="" />
</body>
</html>

Gvozd 24.09.2009 00:42

new Animator(document.getElementById('animated'), 0.2, 50).fadeIn()

vital8 24.09.2009 18:06

Поставил
new Animator(document.getElementById('animated'), 0.2, 50).fadeIn()

вместо
new Animator(document.getElementById('animated'), 0.2, 50).process('mouseover', 'mouseout');


К сожалениею - не работает ни в IE ни в FF


Часовой пояс GMT +3, время: 19:25.