Codly

html css

a#gotop {
width:71px;
height:29px;
background-image:url("../images/gotop.png");
position: fixed;
left: 50%;
margin-left: 520px;
bottom:335px;
}

/**
 * Скрипт Скроллинга: кнопка наверх
 * css class кнопки: scrollTop
 */
 
window.top = {};
var sc = window.top;
 
sc.time = 12; // время прокручивания
 
sc.goTop = function (time, acceleration) {
    acceleration = acceleration || 0.1;
    time = time || sc.time;
 
    var dx = 0;
    var dy = 0;
    var bx = 0;
    var by = 0;
    var wx = 0;
    var wy = 0;
 
    if (document.documentElement) {
        dx = document.documentElement.scrollLeft || 0;
        dy = document.documentElement.scrollTop || 0;
    }
    if (document.body) {
        bx = document.body.scrollLeft || 0;
        by = document.body.scrollTop || 0;
    }
    var wx = window.scrollX || 0;
    var wy = window.scrollY || 0;
 
    var x = Math.max(wx, Math.max(bx, dx));
    var y = Math.max(wy, Math.max(by, dy));
 
    var speed = 1 + acceleration;
    window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
    if(x > 0 || y > 0) {
        var invokeFunction = "window.top.goTop("+ time +")"
        window.setTimeout(invokeFunction, time);
    }
    return false;
}
 
sc.showHide = function (){
    var a = document.getElementById('gotop');
 
    if( ! a ){
        // если нет элемента добавляем его
        var a = document.createElement('a');
        a.id = "gotop";
        a.className = "scrollTop";
        a.href = "#";
        a.style.display = "none";
        a.style.position = "fixed";
        a.style.zIndex = "9999";
        a.onclick = function(e){ e.preventDefault(); window.top.goTop(); }
        document.body.appendChild(a);
    }
 
    var stop = (document.body.scrollTop || document.documentElement.scrollTop);
    if( stop > 300 ){
        a.style.display = 'block';
        sc.smoothopaque(a, 'show', 30, false);
    } else {
        sc.smoothopaque(a, 'hide', 30, function(){a.style.display = 'none';});
    }
 
    return false;
}
 
// Плавная смена прозрачности
sc.smoothopaque = function (el, todo, speed, endFunc){
    var
    startop = Math.round( el.style.opacity * 100 ),
    op = startop,
    endop = (todo == 'show') ? 100 : 0;
 
    clearTimeout( window['top'].timeout );
 
    window['top'].timeout = setTimeout(slowopacity, 30);
 
    function slowopacity(){
        if( startop < endop ){
            op += 5;
            if( op < endop )
                window['top'].timeout = setTimeout(slowopacity, speed);
            else
                (endFunc) && endFunc();
        }
        else {
            op -= 5;
            if( op > endop ){
                window['top'].timeout = setTimeout(slowopacity, speed);
            }
            else
                (endFunc) && endFunc();
        }
 
        // установка opacity
        el.style.opacity = (op/100);
        el.style.filter = 'alpha(opacity=' + op + ')';
    }
}
 
if (window.addEventListener){
    window.addEventListener("scroll", sc.showHide, false);
    window.addEventListener("load", sc.showHide, false);
}
else if (window.attachEvent){
    window.attachEvent("onscroll", sc.showHide);
    window.attachEvent("onload", sc.showHide);
}