>
Категории вопросов
Задать вопрос +

Основное

Контент-модули

Продвижение сайта

Управление сайтом

Доп. модули

Вебмастеру

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



Как сделать неподвижный плавающий блок справа?

голоса: 0
Подскажите легенький скрипт для закрепления блока при прокрутке страницы.  Подробнее.  На сайте существует сайд бар с несколькими блоками. И при прокрутке, так как они не закреплены, вместе с остальным содержимым уползают наверх при прокрутке.  В одном блоке находися меню категории, к которой относится просматриваемая страница.  Как закрепить этот блок меню, что бы он ""прилипал" к верхнему краю и не уползал, оставаясь всегда на экране?
Адрес сайта https://ex-hort.ru/
| Автор: | Категория: Дизайн сайта

Ответов: 1

голоса: 0
 
Лучший ответ

Пример простого скрипта для решения вашего вопроса, вы можете найти в материале - здесь. Скрипт полностью рабочий и проверенный. 

Только с данного решения не вставляйте себе скрипт:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

он не нужен так как используется системная библиотека от Юкоз.

| Автор:
Выбор ответа лучшим | | Автор: Фёдор Тимофеев
Системная библиотека от Юкоз, подключена по умолчанию?  Я для испытаний использую сайт с доменом второго уровня здесь на юкоз, испробовал три подходящих способа, что то не работает скрипт.   Жаль.
| Автор:
Фёдор Тимофеев,
Да, по умолчанию, если и этот скрипт не работает у вас, тогда извините другого не имею. Хотя проверял на тестовом сайте у себя, все работает.
| Автор:
Yuri_Geruk,
О горе мне. Всего скорей что то я не так делаю. Я уже пол года пытаюсь реализовать эту мечту. Спасибо.
| Автор:
Фёдор Тимофеев,
вы установите как можете идайте ссылку на страницу где это можно увидеть, чтобы понять что именно вы неправильно делаете
| Автор:
webanet,

Из рекомендованного, взял самый первый вариант:

"Плавающим" блоком взял форму поиска, теперь их там две на странице.

Нужный блок назвал: "Поиск плавать"

Вот адрес

Что не так??

| Автор:
Повторно показано | | Автор: Yuri_Geruk
Фёдор Тимофеев,

скрипт прописать забыли который ниже:

<script type="text/javascript">
$(window).scroll(function() {
    var sb_m = 20; /* отступ сверху и снизу */
    var mb = 300; /* высота подвала с запасом */
    var st = $(window).scrollTop();
    var sb = $(".sticky-block");
    var sbi = $(".sticky-block .inner");
    var sb_ot = sb.offset().top;
    var sbi_ot = sbi.offset().top;
    var sb_h = sb.height();
 
    if(sb_h + $(document).scrollTop() + sb_m + mb < $(document).height()) {
        if(st > sb_ot) {
            var h = Math.round(st - sb_ot) + sb_m;
            sb.css({"paddingTop" : h});
        }
        else {
            sb.css({"paddingTop" : 0});
        }
    }
});
</script>

| Автор:
Yuri_Geruk,
Как так вот же: http://joxi.ru/DrlgPPktvBzdJA  http://joxi.ru/KAxBRREtMOG8zm  http://joxi.ru/J2bgEELtXNe5nA     А при просмотре кода страницы его нет, почему? Или его целиком прописать в <head> а не указывать путь к файлу??
| Автор:
Фёдор Тимофеев,

Лучше пропишите вне файла как я приводил пример в сообщении выше. Прописать перед </body>

| Автор:
Yuri_Geruk,
Выполнил все рекомендации http://joxi.ru/Vm6ZeeWcDJnbVm На странице ничего не происходит (http://wmz-online.ucoz.ru/publ/)  Это становиться интересным.  У кого какие мысли, почему не работает скрипт?
| Автор:
Фёдор Тимофеев,

Вот пример на странице https://9bclass.ucoz.ru/blogs/ я завернул блок поиск в данный скрипт. Все работает. И перед боди вы не вставили скрипт:

<script type="text/javascript">
$(window).scroll(function() {
    var sb_m = 20; /* отступ сверху и снизу */
    var mb = 300; /* высота подвала с запасом */
    var st = $(window).scrollTop();
    var sb = $(".sticky-block");
    var sbi = $(".sticky-block .inner");
    var sb_ot = sb.offset().top;
    var sbi_ot = sbi.offset().top;
    var sb_h = sb.height();
 
    if(sb_h + $(document).scrollTop() + sb_m + mb < $(document).height()) {
        if(st > sb_ot) {
            var h = Math.round(st - sb_ot) + sb_m;
            sb.css({"paddingTop" : h});
        }
        else {
            sb.css({"paddingTop" : 0});
        }
    }
});
</script>

потому и не работает.

| Автор:
Yuri_Geruk,

Разобрался только после фразы:  

я завернул блок поиск в данный скрипт

Мои ошибки: 

1. Вставлял скрипт в шаблонах для редактирования, куда угодно (Страница материалов и комментарии, страницы сайта, и прочие). Надо вставлять скрипт, и блок - прилипалу, только в один шаблон (например "Первый контейнер")

2. Не очищал кэш (не всегда)

3. Считал, что советы не верные. (простите)

4. Не корректно задавал вопросы.

5. Пытался заставить "прилипать" блок стоящий между другими. Надо, заворачивать в скрипт, только самый нижний.

Огромное человеческое спасибо Yuri_Gerukimage и webanetimage.  За терпение и помощь.

 

| Автор:
...