Фиксированный блок на CSS без jquery и яваскрипт. Фиксация блока на CSS не нагружает страницу и тем не менее полностью удовлетворяет потребности в фиксировании необходимого блока на странице.Плавающий фиксированный блок не меняющий своего положения при прокрутке страницы установить просто для этого следует внести всего лишь пару строк кода в шаблон блога или сайта.
Установка кода для фиксации блоков на странице.
Процесс установки кода прост до абсурда.Копируем расположенную ниже часть кода CSS и устанавливаем в шаблон блога или же в любой гаджет НТМЛ.
<style> .v-gblock {width: 240px;/* ширина блока */ position: fixed; /* Фиксированное положение */ right: 10px; /* Расстояние от правого края окна браузера */ top: 20%; /* Расстояние сверху */ padding: 10px; /* Поля вокруг текста */ background: #ddd; /* Цвет фона */ border: 1px solid #333; /* Параметры рамки */ }</style> | Смотреть ещёОформление блоков для кодаСлайдер- ротатор для блога Ротатор для баннеров Эффекты для фото на CSS. Как добавить форум на блог |
Параметры настройки блока и место фиксации на странице относительно окна браузера внесены в код и при необходимости можно изменить дизайн.
Та часть текста или фото или баннер или ссылки на подписку,короче всё что душе угодно следует обернуть в контейнер следующего вида. <div class="v-gblock"> Место для фото ссылок картинок</div>. В результате ,если всё было сделано правильно,то на странице появится фиксированный блок не меняющий своего положения при прокрутке страницы.
Фиксированный блок в футере блога.
Также в дополнение к выше сказанному ещё один вариант фиксации содержимого любого гаджета НТМЛ внизу страницы поверх всех элементов.Здесь будет происходить фиксирование блока элементов заключённых в гаджет НТМЛ. Каждый гаджет имеет свой ID или название (выделено красным). Узнать его можно наведя курсор мышки на значок редактирования или же посмотрев в шаблон блога в исходном коде.
<style type="text/css"> #HTML1 { position:fixed; bottom:0px; left:300px; z-index:9999999; width:60%; }</style> |  |
Установка кода для фиксации блока происходит также. Единственное отличие,что весь процесс состоит из одного действия.Пример первого блока справа внизу идёт котёнок.Изменяя значения этот фиксированный блок можно разместить в любом месте страницы.Второй вариант отсутствует.Нет свободного необходимого гаджета,а выглядеть он будет примерно также,но по центру и это будет любой блок,вплоть до меню страниц или заголовка.
