Прокрутка div в независимости от положения курсора
 

Добрый вечер!
Помогите пожалуйста советом начинающему. Два дня не могу решить задачку :help:
Есть страница у которой есть scroll, а внутри нее есть div содержимое которого тоже прокручивается.
Как сделать чтоб при прокрутке колесиком страница прокручивалась, например, до середины, потом прокручивался целиком div, потом остаток страницы. И все это в независимости от положения курсора.
У меня самая загвоздка в том, что я не могу прокрутить div, если курсор вне его границы.

МОгу натолкнуть на мыслю - исльзуйте jquery scroll() - определяйте в переменную (например WH ) высоту страницы, и сравнивайте на событие скролл на сколько она прокрутилась (для этого есть метод offset().top), если offset().top <= (WH/2) значит докрутились до середины и чтобы страница больше не крутилась:

$(window).scroll(function(){
 $(this).scrollTop(WH/2)//как то так
  var div = $('#div');//твой див
  var sclt=div.srcollTop();
  div.srcollTop(sclt-10)//на каждую прокрутку колеса добавляем твоему диву 10 или 20 пх,сколько хочешь.
})

так же ловим момент когда див дошел до верха и и начинаем снова крутить страницу.

Вобщем такая концепция придумалась мне. Вышеприведенный код конечно не решит вашей проблемы, а может и вовсе нерабочий )) , и вообще архитектуру вам еще только предстоит продумать. Надеюсь дал сподвижку.

Большое спасибо! Очень помогло выйти из ступора.

Ребят, у меня практически такая же ситуация, только сначала нужно прокрутить див, а потом по окончанию информации в нем чтобы див уехал и приехал footer, ищу уже несколько дней, не могу найти решение :( Помогите, а? :)

<script type="text/javascript">
	$(document).ready(function() {
var blockScroll = true; // Флаг, указывающий нужно ли блокировать скролл страницы
	 
	 	$('#contentBlock').scroll(function(){
			var gHeightsc = $('#contentBlock').scrollTop();
			var gHeightBlockNew = $('#contentBlocknew').height();
			var gHeight = $('#contentBlock').height();
			gHeightesResult = gHeightBlockNew - gHeight;
			if(gHeightsc==gHeightesResult){
				var blockScroll = false;
			}
			
			
		});	
	

 var UA=window.navigator.userAgent;
 var Firefox = UA.match(/Firefox\/\w+\.\w+/i);
function addHandler(object, event, handler, useCapture) {
     if (object.addEventListener) {
         object.addEventListener(event, handler, useCapture ? useCapture : false);
     } else if (object.attachEvent) {
         object.attachEvent('on' + event, handler);
     } else alert("Add handler is not supported");
}
// Добавляем обработчики
/* Gecko */
 addHandler(window, 'DOMMouseScroll', wheel);
/* Opera */
 addHandler(window, 'mousewheel', wheel);
/* IE */
 addHandler(document, 'mousewheel', wheel);
// Обработчик события
function wheel(event) {
     var delta; // Направление скролла
     // -1 - скролл вниз
     // 1  - скролл вверх
     event = event || window.event;
     // Opera и IE работают со свойством wheelDelta
     if (event.wheelDelta) {
         delta = event.wheelDelta / 120;
         // В Опере значение wheelDelta такое же, но с противоположным знаком
         //if (window.opera) delta = -delta;
          delta = -delta;
     // В реализации Gecko получим свойство detail
     } else if (event.detail) {
         delta = -event.detail / 3;
     }
		
     // Запрещаем обработку события браузером по умолчанию
	if (blockScroll) {     
		 if (event.preventDefault)  event.preventDefault();
	     delta = delta*8;
	     event.returnValue = false;
	     var ScrllBlk=$("#contentBlock");
	     var Height=ScrllBlk.height();
	     var Top = ScrllBlk.scrollTop();
	     if(Firefox) delta = -delta;
	     ScrllBlk.scrollTop(Top+delta);return delta;
	}
}

}); //Конец ready
	

</script>

получился вот такой код, там есть флаг, нашел в инете, если он true, то тогда блок #contentBlock прокручивается, скролл мыши привязан к нему, остальная страница стоит, нужно сделать, чтобы менялся true на false, я прописал код, он идет в самом вверху, все работает, в переменную попадает false, а что делать дальше и как это связать, не понимаю :(