[Асмодиан]

Туплюневрубаюсьнафиквэтугадость

Кароче. нужно следующее: зафиксировать div на верху экрана, чтоб непрокручиваем был.
Тупа ставим position:fixed и работает везде...
Кроме сраного IE6
Ну да лана.
мона теоритически забабахать:
position:absolute;
top:expression(document.body.scrollTop)

или поставить
setInsterval(function() { element.style.top = document.body.scrollTop; }, 500)
ну или onscroll
но хоть так хоть этак scrollTop у меня всегда = 0.
Почему - непойму (скроллбар есть, и он прокручен)

[deMone]

scrollTop + offsetTop попробуй

[Асмодиан]

Не работает.
В целом получается так: если DOCTYPE есть, то scrollTop = 0 по определению, если нет, то всё работает.
Если учитывать также тот факт, что для IE7 такая ручная корректировка не фонтан, у него есть fixed (который работает только с выставленным doctype)...
то фигня получается.
если доктайпа нет, то криво в IE7
если есть, то не работает в IE6.

Добавлено через 36 секунд

Мона в принципе в php определять браузер, и если это IE6, то не слать DOCTYPE

[deMone]

Странно, что offset отказывается работать...

Проверь также переменные scrollY и pageYOffset, но, что-то у меня нет ощущения, что они заработают.

[Асмодиан]

Я пользуюсь Visual Studio для отладки JavaScript кода в IE. И посмему могу в любой момент выполнения сценария видеть список всех свойств любого объекта с их значениями...

Скажу честно, многократно просматривал оъекты window, document, document.body и все их подъобъекты на 3 уровня, но значение никакого свойство никакого объекта даже отдалённо не напоминает позицию скроллинга...

Кароче, Грущу


На W3C scrollTop нашёл тока в драфтах...
Вааще непойму
Но нашёл 1 сумасбродный вариант!
для
html, body
owerflow:hidden
height:100%
внутри наш элемент с position:absolute
и div cо всем содержимым страницы и стилем:
height:100%;
overflow:scroll;


чуть не поперхулся, когда понял, что ОНО работает, но такого изврата в жизни не видел...

[Jenek]

Если указан DOCTYPE то scrollTop ищите здесь
document.documentElement.scrollTop

[Асмодиан]

Итак, нае***ь на эту тему я её забросил, но Jenek меня спас таки.
Усё верно.
для удобства я использовал ф-ию:

function fixed(e, pos)
{
    if (/MSIE (5\.5|6).+Win/.test(navigator.userAgent))
    {
        e.style.position = 'absolute';
        return (document.documentElement.scrollTop + pos) + 'px';
    }
    else e.style.top = pos + 'px';
}

Которая фиксирует элемент средствами javascript если ie = 55, 60, или отменяет сама себя, если IE7


в CSS получается следующее:

#fixeddiv
{
    position:fixed;
    top:100px;
    top:expression(fixed(this, 100));
}

вот так вот, и div получается фиксированным!!!

Замечу также, что фича эта работает с включённым (и валидным) DOCTYPE.
Если DOCTYPE нет, то используем document.body вместо document.documentElement

Плюс ещё добавлю решение Лебедева.

Если добавить в стили такие вот строчки:
body
{
background: url('images/spacer.gif') no-repeat;
background-attachment: fixed;
}

то есть поставить в body бэкграундом прозрачный рисунок (да всё равно какой, главное чтоб существующий и чтобы background-attachment: fixed
то при использовании вышеописанного подхода, наш элемент не будет дрожать!!!
то есть при прокрутке наш фиксируемый элемент будет стоять ровно и его не будет колбасить.
Как фиксированный бэкграунд связан с отсутствием дрожания - я не знаю, но это работает (спроси Лебедева ).

Добавлю также, что данная фича работает ТОЛЬКО при фиксировании через expression...
При перегрузке onscroll, дрожание останется...

[Асмодиан]

ну и напоследок: полноценная фиксация элемента осуществляется функцией:

function fixed(e)
{
	if (/MSIE (5\.5|6).+Win/.test(navigator.userAgent))
	{
	    var off = function(e)
	    {
	        var r = { left: 0, top: 0 };
	        if (e.offsetParent) r = off(e.offsetParent);
	        r.left += e.offsetLeft;
	        r.top += e.offsetTop;
	        r.width = e.offsetWidth;
	        r.height = e.offsetHeight;
	        return r;
	    }
	    var proc = function(nm, sht, bs)
	    {
	        var v = e.currentStyle[nm];
	        if (typeof e['fixedInitial' + nm + 'type'] == 'undefined')
	        {
	            if(/^[0-9]+%$/.test(v))
	            {
	                e['fixedInitial' + nm + 'value'] = parseInt(v);
	                e['fixedInitial' + nm + 'type'] = 2;
	            }
	            else if (v === 'auto')
	            {
	                e['fixedInitial' + nm + 'value'] = off(e)[nm];
	                e['fixedInitial' + nm + 'type'] = 1;
	            }
	            else
	            {
	                e['fixedInitial' + nm + 'value'] = parseInt(v);
	                e['fixedInitial' + nm + 'type'] = 1;
	            }
	        }
	        if (e['fixedInitial' + nm + 'type'] == 2)
	        {
	            e.style[nm] = (sht + bs * e['fixedInitial' + nm + 'value'] / 100) + 'px';
	        }
	        else if (e['fixedInitial' + nm + 'type'] == 1)
	        {
	            e.style[nm] = (sht + e['fixedInitial' + nm + 'value']) + 'px';
	        }
	    }
	    proc('left', document.documentElement.scrollLeft, document.documentElement.clientWidth);
	    proc('top', document.documentElement.scrollTop, document.documentElement.clientHeight);
	    proc('width', 0, document.documentElement.clientWidth);
	    proc('height', 0, document.documentElement.clientHeight);

	    return 'absolute';
    }
    else e.style.position = 'fixed';
}

тоды элемент определяется:

div.fixeddiv
{
    position:fixed;
    position:expression(fixed(this));
}

Данная фигня будет работать только с валидным DOCTYPE
Но фиксирует она элемент даже в том случае, если присутствует не только вертикальный, но и гризонтальный скроллбар.
Кроме того, в случае, если width = n% или height = n%, то размеры будут считаться относительно размера клиентской области, а не ширины документа (копируется поведение fixed в FF, Opera, IE7).
Вот, теперь доволен.
Ну и не забывайте про

body
{
    background:no-repeat center center url(images/spacer.gif) fixed;
}

[TryLight]

Не надо обсирать IE6

Вот этот код у меня в IE6 работает


<html><head>
<title>Абсолютное позиционирование</title>
<script language="javascript">
<!--
function freezetext() {
freeze.style.posTop=document.body.scrollTop;
freeze.style.posLeft=document.body.scrollLeft;
}
//-->
</script>
</head>

<body onScroll="freezetext()">
<div id="freeze" style="position:absolute; z-index:-1; top:1px; left:1px; border:1px solid #000">
<p>Замороженный текст</p>
</div>

<p><font size=5>Первый абзац</font></p>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br>

<p><font size=5>Bтopoй абзац</font></p>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br>

<p><font size=5>Третий абзац</font></p>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br>

<p><font size=5>Четвертый абзац</font></p>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br>

<p><font size=5>Пятый абзац</font></p>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br>

</body>
</html>

[Асмодиан]

поставь вверху: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
и работать перестанет

кроме того, с вашим подходом вас будет ожидать неприятный сюрприз при наличии горизонтального сролла. Вы не сможете прокрутить документ вправа до конца никогда!!!, так как ваш div#freeze будет по ширине равен ширине документа, которая больше ширины окна, и он всегда будет выступать вправо, как не мотайте!


Мой же код учитывает все эти ньюансы!