Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Блок, возвращающийся на место при скроллинге. / 3 сообщений из 3, страница 1 из 1
21.11.2007, 18:33
    #34956427
Ghirik
Ghirik
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок, возвращающийся на место при скроллинге.
Обнаружил, что в сети нет готового простого решения такого эффекта, вот написал.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta http-equiv="Content-Language" content="en"><title>Scrolling</title></head><body><div ID="div" style="position: absolute; z-index: 10; left: 150px; top: 100px; background-color:#C0C0C0; width:100px"> <p> <p> <p> </p></div><script type="text/javascript"><!--var y = 0;function adjPos() { var scrl = document.documentElement.scrollTop; if(scrl != y) { add = .1 * (scrl - y); add > 0 ? add = Math.ceil(add) : add = Math.floor(add); var c = document.getElementById("div").offsetTop + add; document.getElementById("div").style.top = c + 'px'; y = y + add; }}window.setInterval("adjPos()"10);//--></script><p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> </p></body></html>

Может кому пригодится...

Доктип указывать обязательно, иначе, не будет работать document.documentElement.scrollTop
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
21.11.2007, 18:35
    #34956435
Ghirik
Ghirik
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок, возвращающийся на место при скроллинге.
Опять накосячил с выделением
Вот так

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="en">
<title>Scrolling</title>
</head>
<body>
<div ID="div" style="position: absolute; z-index: 10; left: 150px; top: 100px; background-color:#C0C0C0; width:100px">
 <p> <p> <p> </p></div>
<script type="text/javascript">
<!--
var y =  0 ;
function adjPos() {
    var scrl = document.documentElement.scrollTop;
    if(scrl != y) {
        add = . 1  * (scrl - y);
        add >  0  ? add = Math.ceil(add) : add = Math.floor(add);
        var c = document.getElementById("div").offsetTop + add;
        document.getElementById("div").style.top = c + 'px';
        y = y + add;
    }
}
window.setInterval("adjPos()", 10 );
//-->
</script>
<p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> 
<p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> <p> 
<p> <p> <p> </p>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
21.11.2007, 18:39
    #34956452
Ghirik
Ghirik
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок, возвращающийся на место при скроллинге.
Блин!! Да что за редактор! Весь код уродует....
Вот

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="en">
<title>Scrolling</title>
</head>
<body>
<div ID="div" style="position: absolute; z-index: 10; left: 150px; top: 100px; background-color:#C0C0C0; width:100px">
<br><br><br><br><br><br><br>
</div>
<script type="text/javascript">
<!--
var y =  0 ;
function adjPos() {
    var scrl = document.documentElement.scrollTop;
    if(scrl != y) {
        add = . 1  * (scrl - y);
        add >  0  ? add = Math.ceil(add) : add = Math.floor(add);
        var c = document.getElementById("div").offsetTop + add;
        document.getElementById("div").style.top = c + 'px';
        y = y + add;
    }
}
window.setInterval("adjPos()", 10 );
//-->
</script>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>


</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Блок, возвращающийся на место при скроллинге. / 3 сообщений из 3, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
созд. / загр.: 403ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1457332]:
 0ms
get settings:
 11ms
get forum list:
 15ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 66ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 47ms
get tp. blocked users:
 2ms
others: 244ms
total:  403ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]