Fixed-блок на CSS для блога.



Фиксированный блок на 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>


Установка кода для фиксации блока происходит также. Единственное отличие,что весь процесс состоит из одного действия.Пример первого блока справа внизу идёт котёнок.Изменяя значения этот фиксированный блок можно разместить в любом месте страницы.Второй вариант отсутствует.Нет свободного необходимого гаджета,а выглядеть он будет примерно также,но по центру и это будет любой блок,вплоть до меню страниц или заголовка.
Фиксированный блок конечно хорошо,но а как же я.