Пост (в основном) для пользователей:
Blogger, Блоггер (Blogspot, Блогспот)
Сбылась наконец моя мечта, сделать красивое увеличение картинки для Блогспот, как на Вордпресс. Прежде чем продолжать читать, кликните на картинку и если эффект вам понравится, можете ознакомиться с описанием установки.
![]() |
Кликните на картинку |
Это модифицированный скрипт от эффекта Улучшенного Lightbox на Блогспот, Blogger и устанавливается очень просто. Прежде всего в настройках, нужно отключить Lightbox
(скриншот кликабелен)
Потом вставляете в Дизайн - Добавить гаджет - HTML/JavaScript следующий код:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script src='http://rilwis.googlecode.com/svn/trunk/blogger/lightbox.min.js' type='text/javascript'></script><style>/* LightBox */
#jquery-lightbox{position:absolute;top:0;left:0;width:100%;z-index:100;text-align:center;line-height:0}
#jquery-lightbox a,#jquery-lightbox a:hover{border:none}
#jquery-lightbox a img{border:none}
#lightbox-container-image-box{position:relative;background-color:#fff;width:250px;height:250px;margin:0 auto}
#lightbox-container-image{padding:10px}
#lightbox-loading{position:absolute;top:40%;left:0%;height:25%;width:100%;text-align:center;line-height:0}
#lightbox-nav{position:absolute;top:0;left:0;height:100%;width:100%;z-index:10}
#lightbox-container-image-box > #lightbox-nav{left:0}
#lightbox-nav a{outline:none}
#lightbox-nav-btnPrev,#lightbox-nav-btnNext{width:49%;height:100%;zoom:1;display:block}
#lightbox-nav-btnPrev{left:0;float:left}
#lightbox-nav-btnNext{right:0;float:right}
#lightbox-container-image-data-box{font:10px Verdana,Helvetica,sans-serif;background-color:#fff;margin:0 auto;line-height:1.4em;overflow:auto;width:100%;padding:0 10px 0}
#lightbox-container-image-data{padding:0 10px;color:#666}
#lightbox-container-image-data #lightbox-image-details{width:70%;float:left;text-align:left}
#lightbox-image-details-caption{font-weight:bold}
#lightbox-image-details-currentNumber{display:block;clear:left;padding-bottom:1.0em}
#lightbox-secNav-btnClose{width:66px;float:right;padding-bottom:0.7em}</style>
<script src='http://rilwis.googlecode.com/svn/trunk/blogger/lightbox.min.js' type='text/javascript'></script><style>/* LightBox */
#jquery-lightbox{position:absolute;top:0;left:0;width:100%;z-index:100;text-align:center;line-height:0}
#jquery-lightbox a,#jquery-lightbox a:hover{border:none}
#jquery-lightbox a img{border:none}
#lightbox-container-image-box{position:relative;background-color:#fff;width:250px;height:250px;margin:0 auto}
#lightbox-container-image{padding:10px}
#lightbox-loading{position:absolute;top:40%;left:0%;height:25%;width:100%;text-align:center;line-height:0}
#lightbox-nav{position:absolute;top:0;left:0;height:100%;width:100%;z-index:10}
#lightbox-container-image-box > #lightbox-nav{left:0}
#lightbox-nav a{outline:none}
#lightbox-nav-btnPrev,#lightbox-nav-btnNext{width:49%;height:100%;zoom:1;display:block}
#lightbox-nav-btnPrev{left:0;float:left}
#lightbox-nav-btnNext{right:0;float:right}
#lightbox-container-image-data-box{font:10px Verdana,Helvetica,sans-serif;background-color:#fff;margin:0 auto;line-height:1.4em;overflow:auto;width:100%;padding:0 10px 0}
#lightbox-container-image-data{padding:0 10px;color:#666}
#lightbox-container-image-data #lightbox-image-details{width:70%;float:left;text-align:left}
#lightbox-image-details-caption{font-weight:bold}
#lightbox-image-details-currentNumber{display:block;clear:left;padding-bottom:1.0em}
#lightbox-secNav-btnClose{width:66px;float:right;padding-bottom:0.7em}</style>
И все!
25 коммент.:
https://www.blogger.com/profile/13746790384341325111
Расскажи секрет как свой адрес смог поменять без www. Или это было до того как :)?
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/03714046357448661094
http://blogodel.com/2012/11/uluchennyj-lightbox-na-blogspot-blogger.html
Это тот же самый скрипт, только без заднего черного фона. Два одинаковых скрипта мешают друг другу.
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/02919187120267357435
https://www.blogger.com/profile/03714046357448661094
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/11389357778962070667
С уважением, О.В.
PS. Justus, а как сделать виджет, показывающий, сколько посетителей сейчас на сайте, всего постов, всего комментариев, сколько живёт блог? Такой, как у Вас? Буду очень благодарна Вам за очередную полезность:))
https://www.blogger.com/profile/10631575525972186871
PS. А может быть, это у меня только? Я использую Mozilla, раньше было всё хорошо.
https://www.blogger.com/profile/10631575525972186871
https://www.blogger.com/profile/08726457423694510321
https://www.blogger.com/profile/16871310502433582396
http://blogodel.com/2012/12/oformlenie-ssylki-blogspot-blogger.html
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/16871310502433582396
https://www.blogger.com/profile/16545923068116085183
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/08659027101470035180
https://www.blogger.com/profile/13746790384341325111
У вас всё проще-элегантнее. Может когда и до этого ваши руки дойдут.
Буду заглядывать. Ещё раз спасибо.
https://www.blogger.com/profile/08659027101470035180
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/10386165722795359274
https://www.blogger.com/profile/13746790384341325111
https://www.blogger.com/profile/10386165722795359274
Отправка комментария
Дорогие Друзья! К сожалению, по причине здоровья, моя активность по этому блогу будет осуществляться по мере ВОЗМОЖНОСТИ!