Google+ Followers

Будь в курсе событий!

05.07.2013

Меняем фон Blogger Lightbox

Leave a Comment


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

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

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

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

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

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


/* 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

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

0 коммент. :

© 2012-2017 Cash's from program