Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Блок как на Цетис (https://javascript.ru/forum/dom-window/15629-blok-kak-na-cetis.html)

Axios 06.03.2011 20:05

Блок как на Цетис
 
Всем привет, кто может подсказать как сделать блок стили которого зависят от расстояния до верхней границы экрана. Ну может что-то не правильно объясняю, в общем вот пример: http://cetis.ru/portfolio/web/tiger-site/

Интересует тот блок где написано Официальный сайт Международного тигриного форума. Если прокрутить экран вниз, то будет понятно что именно мне необходимо.

Буду рад любым советам.

ksa 06.03.2011 20:21

Axios, там просто скриптом меняют абсолютное позиционирование с отступом на фиксированое без отступа

Axios 06.03.2011 20:30

Скрипт я видел
 
Ну да, скрипт я видел.

$(window).scroll(function(){
getscroll();
if($.browser.msie && $.browser.version == 6) {
$('#panel').css('position','absolute').css('top',' 182px')
} else {
if (yScroll > 182)
{$('#panel').css('position','fixed').css('top','0p x')} else
{$('#panel').css('position','absolute').css('top', '182px')}
}
});


Но, я попробовал его подключить, но чего-то не работает.

ksa 06.03.2011 20:34

Цитата:

Сообщение от Axios
я попробовал его подключить, но чего-то не работает

Может не так "подключал"... :)

Axios 06.03.2011 20:37

Да вроде правильно
 
KSA, ну смотри все файлы подключил, все открываются


<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/script.js"></script>


ну и соответственно сам див


<div id="panel"></div>

Aetae 06.03.2011 20:55

Какие сложности очуметь.
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">window.onload=function(){
	var scrl=document.getElementById('scroll');
	window.onscroll=function(){
		if (document.documentElement.scrollTop>100) scrl.style.cssText='position:fixed;top:0px;';
		else scrl.style.cssText='';
	}
}
</script>
<style type="text/css">
body{padding:1000px 5px}
#scroll{
	top:100px;
	border:1px solid #000;
	position:absolute;
}
</style>
</head>
<body>
	<div id="scroll">блок</div>
</body>
</html>

Axios 16.03.2011 23:36

Попробую твой вариант
 
Спасиб. Попробую


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