Сложная маска

[kostyabramin]

Привет!

Нужна помощь.

Есть картинка высотой 2000 пикселей. Возможно ли маскировать ее так, чтобы от нее был виден только квадрат 100 на 100, но при этом чтобы она прокручивалась? То есть чтобы страница была 2000 по высоте, и внутри этого квадрата при прокрутке изменялась картинка (а сам квадрат стоял бы на одном месте - был fixed)?

Понимаю, что надо делать два div'а с разными позиционированиями, но как именно, не могу понять, бьюсь уже два дня.

Заранее спасибо.

[kostyabramin]

http://kostyaloginov.com/index____.html

Ну то есть как здесь, только наоборот: надо, чтобы прямоугольник при скроллинге не двигался, а картинка, наоборот, скроллилась

[Deight]

Вопрос не очень понятен, мне кажется вам нужно изменить свойство css: overflow для div-а в котором будет картинка.

[kostyabramin]

смотрите:

мне надо, чтобы внешний диф был фиксд, а внутренний - абсолют относительно всей страницы, а не относительно внешнего дива. представьте себе окошко посреди белой страницы. при скроллинге окошко не движется, а большая картинка внутри него - движется противоположно направлению скроллинга

если сделать overflow: hidden, то картинка внутри не будет двигаться, понимаете?

[Deight]

Если честно то я ничего не понял. Сама страница будет скролица? Вы бы нарисовали где что и 2-3 положения. Под overflow я имел ввиду overflow:scroll или auto. Или вам нужно как со scroll только без полосок прокрутки?

[kostyabramin]

Я уже сделал с яваскриптом: посередине страницы фиксированный див, внутри него при скроллинге (всей страницы) движется большое изображение (скрипт стоит прямо в body). понятно, что придется еще возиться с fixed в IE, но это уже к делу не относится

<script language="JavaScript">
function rrr() {
document.getElementById('myDiv').style.backgroundPosition = "0px " + document.body.scrollTop+"px";
}
setInterval("rrr()", 1);
</script>

div#myDiv 
{
	top:30%; 
	left:30%;  
	width:40%; 
	height:40%; 
	background:url(bigimage.jpg;
	position:fixed;
}

спасибо в любом случае

[kostyabramin]

кстати еще вопрос: можно ли обойтись без отдельного ява-скрипта?

например, у IE есть такая штука для css как expression

ну там:

div#myDiv 
{

	background:url(bigimage.jpg;
	background-position:expression("0px " + document.body.scrollTop+"px");
}

нет ли аналогичной штуки для остальных браузеров. то есть чтобы не выставлять в ява скрипте значение отдельного css-свойства у отдельного объекта, а наоборот - задавать яваскриптовое значение внутри css?