Меняющийся фон шапки блога.

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

Код совершенно простой.
<script type="text/javascript">
var banner= new Array()
banner[0]=" URL картинки 1"
banner[1]=" URL картинки 2 "
banner[2]=" URL картинки 3 "
banner[3]=" URL картинки 4"
var random=Math.floor(4*Math.random());
document.write("<style>");
document.write("#header {");
document.write(' background:url("' + banner[random] + '") no-repeat top left;');
document.write(" }");
document.write("</style>");
</script>
Подготовьте сначала свои изображения, которые будут меняться при перезагрузке страницы. При выборе обратите внимание на их ширину. В разделе шаблон-вкладка настроить посмотрите размер шапки. Или щёлкните правой кнопкой мыши по названию блога, выберите функцию просмотр кода и откроется окно с размерами.

Возможно, придётся поменять цвет названия блога или изображения подобрать соответственно, чтобы не сливалось.

Теперь устанавливайте ваши адреса картинок вместо строк, помеченных синим цветом. Я указала всего 4. Тут можно установить сколько угодно. Добавляйте, дополнительно строки banner[4]=" URL картинки 5" и так далее, меняя цифровые значения. И количество изображений в строке.

var random=Math.floor(4*Math.random());

Готовый код смело вставляем в гаджет HTML/JavaScript в любое место блога.

Ну вот и всё сегодня. Благодарю за внимание. Всем удачи и до встречи.


здесь можно оформить подписку на новые шпаргалки

Введите Ваш email


5 комментариев:

  1. Полезная шпаргалка, может пригодиться.

    ОтветитьУдалить
    Ответы
    1. Наталья, хотела ещё предложить код слайд-шоу в шапке, но протестировала и он очень сильно влияет на загрузку и пришлось отказаться от этой затеи.

      Удалить
    2. Да, быстрая загрузка - это важно. Если слайдшоу тормозит, то лучше его не использовать вовсе.

      Удалить
  2. спасибо Вам. достаточно интересно, точно пригодится.

    ОтветитьУдалить
    Ответы
    1. Привет, Семён. Это просто мои шпаргалки. Так что когда надумаете что-то сотворить, забегайте.

      Удалить

Пользовательский поиск