Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.04.2013, 13:06
Интересующийся
Отправить личное сообщение для boichukvd Посмотреть профиль Найти все сообщения от boichukvd
 
Регистрация: 11.10.2012
Сообщений: 27

Позиционирование блока
Здравствуйте.
Стоит задача позиционирования или прилипание блока при прокрутке.
Есть два блоки, которые по высоте не помещаются в экран компьютера. Допустим: при прокрутке вниз, низ нижнего блока прилипал к экрану внизу, ну и при прокрутке вверх верхний блок прилипал к верху экрана.
Возможно ли такое сделать и как?
Изображения:
Тип файла: jpg 1.jpg (31.5 Кб, 1 просмотров)
Тип файла: jpg 2.jpg (31.1 Кб, 3 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 08.04.2013, 13:44
Интересующийся
Отправить личное сообщение для boichukvd Посмотреть профиль Найти все сообщения от boichukvd
 
Регистрация: 11.10.2012
Сообщений: 27

Нашел такой вот код, практически то, что надо.
Думаю знающие понимают его работу, а как дописать под то что мне надо?
var $window = $(window),
$navigation = $("#sidebar-L");

$window.scroll(function() {
	if (!$navigation.hasClass("fixed") && ($window.scrollTop() > $navigation.offset().top)) {
		$navigation.addClass("fixed").data("top", $navigation.offset().top);
	}
	else if ($navigation.hasClass("fixed") && ($window.scrollTop() < $navigation.data("top"))) {
		$navigation.removeClass("fixed");
	}
});
Ответить с цитированием
  #3 (permalink)  
Старый 08.04.2013, 18:51
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,583

Вроде бы и понял, но всё равно html-код(максимально упрощённый) примера в студию.
__________________
29375, 35
Ответить с цитированием
  #4 (permalink)  
Старый 08.04.2013, 18:56
Интересующийся
Отправить личное сообщение для boichukvd Посмотреть профиль Найти все сообщения от boichukvd
 
Регистрация: 11.10.2012
Сообщений: 27

Сообщение от Aetae
Вроде бы и понял, но всё равно html-код(максимально упрощённый) примера в студию.
А может я сайт приведу где я это делаю, а то сомневаюсь, что поможет мой забитый html и css. Уверен что буде сложно понять
Ответить с цитированием
  #5 (permalink)  
Старый 08.04.2013, 19:02
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,583

Потому и говорится, что максимально упрощённый: 3.5 div'а и css.

Эти блоки фиксированной высоты? Эти блоки одинаковой высоты? Итд.
__________________
29375, 35

Последний раз редактировалось Aetae, 08.04.2013 в 19:05.
Ответить с цитированием
  #6 (permalink)  
Старый 08.04.2013, 19:19
Интересующийся
Отправить личное сообщение для boichukvd Посмотреть профиль Найти все сообщения от boichukvd
 
Регистрация: 11.10.2012
Сообщений: 27

<div id="header">Шапка</div>
<div id="main">
     <div id="sidebar-L">Здесь реклама, которая должна двигаться при прокрутке страницы</div>
     <div id="sidebar-R">Блок справа</div>
     <div id="contentWrapper">Контент</div>
</div>
<div id="footerWrap">Подвал</div>


#main {
        padding-top: 20px;
	border-left: #888822  solid 1px;
	border-right: #888822  solid 1px; 
        background-color:#FFF;
	}
	
#sidebar-L {
        padding: 0 0 0 25px;
        margin: 0;
	width:165px;  
	float:left;
	} 
	
#sidebar-R { 
        position: relative;
        z-index: 2;
	width:265px; 
	float:right;
        padding: 0 25px 0 0;
	}

sidebar-L в себе содержит:
<script type="text/javascript"><!--
google_ad_client = "ca-pub-9325669243895290";
/* Sidebar_L_160x600 */
google_ad_slot = "3334151273";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

<script type="text/javascript"><!--
google_ad_client = "ca-pub-9325669243895290";
/* Sidebar_L_160x600 */
google_ad_slot = "3334151273";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
Ответить с цитированием
  #7 (permalink)  
Старый 08.04.2013, 22:00
Интересующийся
Отправить личное сообщение для boichukvd Посмотреть профиль Найти все сообщения от boichukvd
 
Регистрация: 11.10.2012
Сообщений: 27

Почему никто не может помочь, если что блок слева по ссылке: http://beauty-in-health.net/jumor/aforizmy-pro-dietu/
При прокрутке в конец блок уходит под footerwrap, а нужно чтобы останавливался коснувшись грани footerwrap. Плиз
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
вычисление и фиксация ширины блока konstantin-mn jQuery 2 27.08.2012 11:42
слайд панели tadjik1 Элементы интерфейса 22 02.04.2012 17:13
Позиционирование блока по центру окна Keksman jQuery 2 21.03.2012 16:14
Два блока div разъезжаются при скроллинге окна браузера. call007 jQuery 0 03.04.2011 16:21
позиционирование блока Yurii Общие вопросы Javascript 0 26.08.2008 08:16