Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.02.2013, 16:17
Интересующийся
Отправить личное сообщение для foreach Посмотреть профиль Найти все сообщения от foreach
 
Регистрация: 04.03.2011
Сообщений: 22

Как определить, что блок скрылся за нижней границей окна?
Прошу прощения за тупой вопрос. Совсем запутался. Не получается отловить ситуацию когда блок при прокрутке страницы скрывается за нижней границей окна браузера. Пробовал разные варианты, что то все не то. Натолкните на мысль пожалуйста.
Ответить с цитированием
  #2 (permalink)  
Старый 15.02.2013, 16:29
Аватар для animhotep
Профессор
Отправить личное сообщение для animhotep Посмотреть профиль Найти все сообщения от animhotep
 
Регистрация: 17.01.2013
Сообщений: 887

возьми высоту окна и сравни с позицией блока http://api.jquery.com/position/
Ответить с цитированием
  #3 (permalink)  
Старый 15.02.2013, 16:29
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

В идеале, если прокручивается body, то:
if ($('body)[0].scrollTop + $(window).height() < $('/*селектор*/').offset().top) {
  //Ваше условие
}


(в некоторых браузерах $('body)[0] надо заменить на $('html')[0])

Последний раз редактировалось tsigel, 15.02.2013 в 16:32.
Ответить с цитированием
  #4 (permalink)  
Старый 15.02.2013, 17:26
Интересующийся
Отправить личное сообщение для foreach Посмотреть профиль Найти все сообщения от foreach
 
Регистрация: 04.03.2011
Сообщений: 22

Сообщение от animhotep Посмотреть сообщение
возьми высоту окна и сравни с позицией блока http://api.jquery.com/position/
Не получится.
$(window).scroll(function () {
			var spac = $(window).height();
			var pos = $('#spacer').position().top;
			$('#status').text('h='+spac+'  p='+pos);
            
        });

При разрешении экрана 1024х768
h=631
p=1500
При 1280х1024
h=887 p=1500

Я это уже второй день мучаю. Не выходит ничего.
Ответить с цитированием
  #5 (permalink)  
Старый 15.02.2013, 18:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,055

foreach,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
body {
   height: 1000px
}
#spacer {
    position: relative;
    top: 500px;
	width: 300px;
	height: 100px;
    background-color: #FF0066;
	}
#status {
    position:  fixed;
    top: 0px;
	width: 300px;
	height: 30px;
    background-color:  #66FFFF;
	}
</style>
<script type="text/javascript">
$(document).ready(function (){
$(window).scroll(function () {
			var spac = $(window).height();
			var pos = Math.round($('#spacer').position().top) ;
            var scroll =  $(window).scrollTop()
            $('#status').text('h = '+spac+'  p= '+pos + ' s = '+scroll + ' show =  ' + (spac+scroll > pos));

        });
});
</script>
</head>
<body>
<div id='status'>
</div>
<div id='spacer'>
</div>
<script>
</script>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 15.02.2013, 18:30
Интересующийся
Отправить личное сообщение для foreach Посмотреть профиль Найти все сообщения от foreach
 
Регистрация: 04.03.2011
Сообщений: 22

Сообщение от tsigel Посмотреть сообщение
В идеале, если прокручивается body, то:
if ($('body)[0].scrollTop + $(window).height() < $('/*селектор*/').offset().top) {
  //Ваше условие
}


(в некоторых браузерах $('body)[0] надо заменить на $('html')[0])
Спасибо за хорошую идею. Примерно так и получилось.
document.documentElement.scrollTop + $(window).height()


Спасибо еще раз всем за советы.
Ответить с цитированием
  #7 (permalink)  
Старый 15.02.2013, 18:35
Интересующийся
Отправить личное сообщение для foreach Посмотреть профиль Найти все сообщения от foreach
 
Регистрация: 04.03.2011
Сообщений: 22

О_о
Рано обрадовался. В хроме почему то не работает.
В хроме не срабатывает
document.documentElement.scrollTop

Может кто то знает как его об..ть обойти?

Последний раз редактировалось foreach, 15.02.2013 в 18:37.
Ответить с цитированием
  #8 (permalink)  
Старый 15.02.2013, 18:42
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,055

foreach,
и в 5 посте хром неработает?
Ответить с цитированием
  #9 (permalink)  
Старый 15.02.2013, 18:44
Интересующийся
Отправить личное сообщение для foreach Посмотреть профиль Найти все сообщения от foreach
 
Регистрация: 04.03.2011
Сообщений: 22

Сообщение от рони Посмотреть сообщение
foreach,
и в 5 посте хром неработает?
Тут
$(window).scrollTop()

всегда равен 0. Во всех браузерах.
Ответить с цитированием
  #10 (permalink)  
Старый 15.02.2013, 18:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,055

может ещё кто-то проверит работу скрипта? у меня он работает во всех браузерах.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Открытие div блока при первом визите на сайт Nushaba Общие вопросы Javascript 28 20.12.2013 20:24
Кто как учит/учил/ будет учить Английский ? DjDiablo Оффтопик 53 18.12.2012 20:01
Как определить активное окно/вкладку? Chameleon Events/DOM/Window 5 19.03.2012 07:59
Как изменить скрипт, что бы им его можно было использовать для нужной страницы Nick50_70 Общие вопросы Javascript 0 28.04.2009 23:30
как определить позицию элемента относительно окна scuter Events/DOM/Window 5 07.05.2008 18:47