10:24
7


Привет всем, моим читателям. Это снова я, с новыми идеями для наших блогов на платформе blogspot.  Сегодня я хочу вам предложить интересное решение по замене фона Lightbox.

Но для начала я расскажу, что  за зверь это  такой:

Lightbox – это такой скрипт, отвечающий за галерею ваших фотографий и показанные в миниатюре. Которые после нажатия увеличиваются в размерах. Стандартный Lightbox на платформе blogspot выглядит примерно так:

Стандартный фон Blogger Lightbox

Возможно, кто-то  захочет немного видоизменить его. Тогда  я предлагаю вам заменить  его на более живой и интересный фон + можно изменить  и кнопочку закрытия. Выглядеть это будет примерно так
Измененный фон Blogger Lightbox

Скрипт для изменения фон  
Lightbox  нужно вставить перед тегом </b:skin>


/* Background Color */
.CSS_LIGHTBOX_BG_MASK {
background-color: #ffffff !important;
background-image: url(http://www.tarantulasworks.com/wallpaper/images/wallpaper/fractals/156.jpg) !important;
opacity: 0.9 !important;
filter: alpha(opacity=90) !important;
}
/* Images Border */
.CSS_LIGHTBOX_SCALED_IMAGE_IMG {
outline: 0px solid #fff !important;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 0px 5px #000000;
-moz-box-shadow: 0px 0px 5px #000000;
box-shadow: 0px 0px 5px #000000;
}
/* Close Button */
.CSS_LIGHTBOX_BTN_CLOSE {
background: url(http://cdn4.iconfinder.com/data/icons/aiga-symbol-signs/580/aiga_lefnddownarrow_inv-24.png) no-repeat !important;
width: 24px !important;
height: 24px !important;
}
/* Thumbnails Bar Color */
.CSS_LIGHTBOX_FILMSTRIP {
background-color: #eaeaea !important;
}
/* Text Color */
.CSS_LIGHTBOX_ATTRIBUTION_INFO, .CSS_LIGHTBOX_ATTRIBUTION_LINK {
color: #000 !important;
}
/* Index Info (number of images) */
.CSS_LIGHTBOX_INDEX_INFO {
color: #555555 !important;
}

Разяснения:
http://www.tarantulasworks.com/wallpaper/images/wallpaper/fractals/156.jpg- адрес фона
http://cdn4.iconfinder.com/data/icons/aiga-symbol-signs/580/aiga_lefnddownarrow_inv-24.png -адрес кнопки закрытия
0.9 -прозрачность фона

Кнопочки закрытия я нашла по этому адресу http://cdn4.iconfinder.com
Фон я просто закачала  понравившуюся картинку размерами 1900 на 1200

Ну что же, пожалуй на этом все. Па-па.
Система Orphus

Пожалуйста не забывайте нажать

7 коммент.:

  1. я вот не особо понимаю, а куда этот код или текст вставлять?

    ОтветитьУдалить
    Ответы
    1. Ярослава, это у меня дырявая бошка стала. Поправила код нужно вставить перед . Извините за накладку)

      Удалить
  2. Не понятно, что и куда вставлять. Через HTML в сообщении не вставляется. Аня, до конца объясните что и куда вставлять.

    ОтветитьУдалить
  3. Это вставляется не через HTML сообщении а именно в шаблон. С лева (где вы выбираете гаджеты)под Дизайном есть ниже Шаблон. Нажимаете Шаблон- Изменить HTML- ищете через нажатие клавиш Ctrl+F нужный вам тег и вставляете, скрипт

    ОтветитьУдалить
  4. http://studying-blogin.blogspot.com/2012/12/html-blogger.html вот еще тут более понятней, что и где искать описанно

    ОтветитьУдалить

Есть вопросы? Или просто хочется поговорить? Оставляйте комментарии