Сворачивание sidebar при прокрутке

#1 11 мая 2013 в 21:35

Вроде бы, давным-давно, создавалась тема с пожеланием убирать sidebar при прокрутке, если в нем ничего не выводится.
Решение никто не опубликовал, вроде бы… Тему не нашел. Если баян, не пинать joke

Если кому пригодится, вынесу код на обсуждение…

Разработка виджетов, полей и компонентов, сайты под ключ. site: www.zau4man.ru telegram: @zau4man консультации: 300р./час

#2 11 мая 2013 в 22:20

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

Я меняю валюту на сайте obmenka. Рекомендую! Возможен вывод в наличные деньги.

#3 12 мая 2013 в 00:41

Евгений, очень прикольная штучка, если есть возможность поделиться — делитесь.
Спасибо!

Украинский для инстант

Сегодня в 06:15

#4 12 мая 2013 в 09:24

Вод код, вставить после тега <body>

 
<script type="text/javascript">
	$(function() {
		var ptop = $("#sidebar").offset().top;
		var ptop2 = $("#sidebar").height();
		var itogo = ptop + ptop2;
    $(window).scroll(function(){
		var scrollTop = $(window).scrollTop();
        if(scrollTop >= itogo){
        	$("#sidebar").css("display","none");
            $("#main").removeClass("grid_8").addClass("grid_12");
        }
        else
        	{
        	$("#main").removeClass("grid_12").addClass("grid_8");
        	$("#sidebar").css("display","block");
        	}
    });
	});
</script>

Я меняю валюту на сайте obmenka. Рекомендую! Возможен вывод в наличные деньги.

#5 12 мая 2013 в 10:01

Вод код, вставить после тега <body>
st.Puh

да, совершенно верно :)
просто код быдловатый😊может кто приберет…

Разработка виджетов, полей и компонентов, сайты под ключ. site: www.zau4man.ru telegram: @zau4man консультации: 300р./час

#6 12 мая 2013 в 10:07

var ptop = $("#sidebar").offset().top; — узнаем сколько от слоя с id sidebar до верха экрана.
var ptop2 = $("#sidebar").height(); — узнаем высоту слоя id sidebar
var itogo = ptop + ptop2; — складываем, теперь мы знаем где заканчивается sidebar
if(scrollTop >= itogo){ — если прокрутили больше, то
$("#sidebar").css("display","none"); — прячем сайдбар
$("#main").removeClass("grid_8").addClass("grid_12"); — убираем старый класс, добавляем новый, чтобы контент стал на всю ширину
else — если прокрутили меньше высоты сайдбара, его нужно вернуть
$("#main").removeClass("grid_12").addClass("grid_8"); — убираем новый класс, возвращаем старый
$("#sidebar").css("display","block"); — возвращаем видимость сайдбару

У кого свои шаблоны, правьте имена классов и id слоев…

Разработка виджетов, полей и компонентов, сайты под ключ. site: www.zau4man.ru telegram: @zau4man консультации: 300р./час

#7 12 мая 2013 в 12:37

Даааа, несколько прикольчиков можно соорудить.
Спасибо!

Украинский для инстант

[ РЕШЕНО] за инвайт Родину гот

Ваша версия InstanCMS

Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.

Сворачивание sidebar при прокрутке

Похожие темы

как сделать прокрутку при составлении статьи?

Как изменить стиль для Сворачиваемых блоков

Сворачивание комментариев

Как по умолчанию сворачивать заголовки фильтра ?

Полоса прокрутки или адаптивные таблицы

[ЕСТЬ РЕШЕНИЕ] Как в Moderne зафиксировать главное горизонтальное меню при прокрутке страницы?

InstantCMS Team

О проекте

Поддержка

Дополнения