Задать вопрос
Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Стили (CSS) » Остановка скользящего (прилипающего) блока при достижении определенного дива

Остановка скользящего (прилипающего) блока при достижении определенного дива

     27.03.2014    Стили (CSS), jQuery    10533

вопрос
Добрый день. Есть простой скрипт, который позволяет установить скользящий блок, но проблема в том, что он идет при прокрутке до конца страницы перекрывая собой футер и контент который находится после див блока в котором он должен двигаться. Вопрос как возможно, чтобы такой блок останавливался достигнув определенного дива или другого блока или двигался только в приделах конкретного контейнера

Код скрипта
 Показать / Скрыть текст


Карявенькая картинка
 Показать / Скрыть текст


Как возможно реализовать, что бы скользящий блок под номером 3, никогда не выходил за пределы блока 1, или останавливался при достижении блока под номером 4. Вот такая проблемка возникла. Возможно подскажете другой скрипт с помощью которого можно это реализовать. Заранее благодарен.

Ответил: ПафНутиЙ

Используйте плагин sticky-kit - это как раз то, что необходимо.

3 комментария

mastodontoff
Юзер

mastodontoff - 27 марта 2014 17:16 -

Нашел еще один скрипт
<script type="text/javascript">
    $(function() {
        var offset = $("#fixed").offset();
        var topPadding = 15;
        $(window).scroll(function() {
            if ($(window).scrollTop() > offset.top) {
                $("#fixed").stop().animate({marginTop: $(window).scrollTop() - offset.top + topPadding});
            }
            else {$("#fixed").stop().animate({marginTop: 0});};});
    });
</script>

<div id="fixed">Сам блок</div>
Но он двигает в низ все, что находится под ним
mastodontoff
Юзер

mastodontoff - 27 марта 2014 22:08 -

Все работает, огромное спасибо.
andreyberg
Юзер

andreyberg - 10 июля 2015 15:21 -

Пафнутий, а как именно пользоваться sticky-kit ?

Поискал в инете, никто инструкций хоть каких-то не даёт.
Сам потыкал, подключил файл JS, прописывал в нужный блок ID=sidebar или id=sticky_item, но толку ноль, блок не двигается((

Можно хоть какой-то намёк полному нубу.
Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

 25.08.2011 Гость  Стили (CSS)
 21.10.2012 wcw2007  Стили (CSS), jQuery
 01.04.2013 Heon  Шаблоны (TPL), Стили (CSS)
 10.08.2013 G-Force  Стили (CSS), jQuery
 21.08.2013 onneuha  Стили (CSS), jQuery, Ламерские вопросы
 08.01.2014 Torman  Стили (CSS)
 25.03.2014 TTATPuOT  Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS), jQuery
 29.10.2014 G-3p  Общие вопросы по вёрстке, Стили (CSS)
 13.02.2015 249893  Шаблоны (TPL), Стили (CSS)
 02.06.2015 BRAGA  Стили (CSS)
  • non-stop | Как решить проблему индексации DLE в пои ... 1
    Фото non-stop
    non-stop
    Как решить проблему индексации DLE в поиске Bing?
    19-12-2024, 17:02
    Забыл написать что обновился до последней версии 17.3
    Интересно узнать, это только у меня проблема, или это проблема движка? проверьте свои сайты на наличие в поиске Bing.
    В 11 винде именно эта поисковая система стоит по умолчанию . кроме того эта же поисковая система отвечает за индекс еще одного поисковика - yahoo. Эти системы могут давать дополнительный процент пискового трафика на сайты.
  • lutskboy | Как максимально грамотно организовать до ... 1
    Фото lutskboy
    lutskboy
    Как максимально грамотно организовать добавление материалов через SQL-запросы?
    18-12-2024, 21:39
    все верно. related_ids автоматом заполняется потом.
  • derebas | Убираем xfsearch из адресной строки 7
    Фото derebas
    derebas
    Убираем xfsearch из адресной строки
    16-12-2024, 02:35
    в правилах транслитерации для tagvalue поставьте замену " " => "-", например так
    str_replace(array('.', ' ', '/', '&', "'", '+', '«', '»', ':', '!'), array('', '-', '-', 'and', '', '', '', '', '', '')
  • toxicpioner | Убираем xfsearch из адресной строки 7
    Фото toxicpioner
    toxicpioner
    Убираем xfsearch из адресной строки
    15-12-2024, 19:31
    если в доп поле есть пробел, будет выдавать просто 403 стр
  • dj-avtosh | Воспользовался хаком удаление html из ад ... 2
    Фото dj-avtosh
    dj-avtosh
    Воспользовался хаком удаление html из адресной строки у новости, появилась ошибка, как пофиксить?
    12-12-2024, 17:26
    Нужно правило с year поднять выше всех в .htaccess
  • TeraMoune | Воспользовался хаком удаление html из ад ... 2
    Фото TeraMoune
    TeraMoune
    Воспользовался хаком удаление html из адресной строки у новости, появилась ошибка, как пофиксить?
    11-12-2024, 22:12
    У вас убрано слишком много отличительных признаков в ссылках и теперь ссылки пересекаются. Убрали xfsearch, убрали html, а так же зачем то убрали дефиз разделяющий id и alt_name. Теперь некоторые ссылки будут отвечать выражению под правила ссылок новостей. Исправить вы можете только переосмыслив эти ссылки и добавить в них каких-то отличительных особенностей, переосмыслить чпу.
  • toxicpioner | Как упорядочить ID новостей 19
    Фото toxicpioner
    toxicpioner
    Как упорядочить ID новостей
    9-12-2024, 22:24
    ***Комментарий удален***
  • DnCnv | Как показать только одну категорию, к ко ... 1
    Фото DnCnv
    DnCnv
    Как показать только одну категорию, к которой принадлежит новость?
    9-12-2024, 01:46
    ***Комментарий удален***
  • web102 | Почему не отображается картинка в галере ... 3
    Фото web102
    web102
    Почему не отображается картинка в галерее?
    4-12-2024, 11:49
    дайте адрес сайта. можно в личку
  • Shandi | Почему не отображается картинка в галере ... 3
    Фото Shandi
    Shandi
    Почему не отображается картинка в галерее?
    3-12-2024, 08:53
    Мне как ламеру ничего не понятно:( Кто-то это исправляет за денужку?
наверх