Информационно приветственный баннер, который не раздражает читателей (с куками) и с таймером, для Блоггер, Блогспот


Пост (в основном) для пользователей:
Blogger, Блоггер (Blogspot, Блогспот)

Вот такое замысловатое название у изделия, которое я предлагаю вашему вниманию. Этот баннер "изготовлен" мною из нелюбимых читателями всплывающих окон.

Всплывающих окон больше не будет, а вместо них, вы можете вставить любое изображение. При переходе нового читателя картинка появится только один раз и не будет "преследовать" посетителя во время "листания" блога.

Скрипт не имеет аналогов в интернете, так как обладает одновременно двумя особенностями - таймером (картинка без необходимости нажимать на close пропадает сама) и так называемыми куками (скрипт "запоминает" посетителя и показывает картинку только один раз и только новым посетителям).




Код вставляется очень просто:
В Дизайн - Добавить гаджет - HTML/JavaScript  



<style>  #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position: fixed;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}.cboxPhoto{float:left; margin:auto; border:0; display:block;} #cboxSlideshow{cursor:pointer;} </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js" type="text/javascript"></script> <script>
$(document).ready(function() {
setTimeout ("$('#popup2').fadeIn('fast');", 6000);
setTimeout ("$('#popup2').fadeOut('slow');", 9000);
});
</script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script> <script type="text/javascript"> jQuery(document).ready(function(){ if (document.cookie.indexOf('visited=true') == -1) { var fifteenDays = 1000*60*60*24* 7 ; var expires = new Date((new Date()).valueOf() + fifteenDays); document.cookie = "visited=true;expires=" + expires.toUTCString(); $.colorbox({width:"0px", inline:true, href:"#subscribe"}); } }); </script> <!-- This contains the hidden content for inline calls --> <div style='display:none'> <div id='subscribe' style='padding:0px;'><center><span id='popup2'><img border="0" height="69" src="http://3.bp.blogspot.com/-Z1yxE_YzLjw/UN-1OavIMxI/AAAAAAAACns/WLWM8SQ5wIs/s1600/cooltext868333624.png" width="490" /></span></center></div> </div>

Как вы уже догадались, там где выделено красным, вы можете вставить код картинки или еще проще урл.-адрес картинки, туда где синий цвет.


Для проверки и настройки скрипта, я рекомендую редактор:
http://www.timsfreestuff.com/HTMLEditor/


Внимание! картинка будет показываться только один раз! Если пожелаете увидеть, как работает скрипт, зайдите на свой блог с другого браузера.
Если у вас уже есть "двигающиеся" виджеты со скриптом jQuery, то код может не работать!

18 коммент.:

Блоgгер
Алина Солнечная
Justus
Игорь Мальцев
Justus
Игорь Мальцев
Justus
Максим Волченко
Justus
Максим Волченко
Justus
Максим Волченко
Justus
Максим Волченко
Вадим Маслий
Рогозин Роман
Рогозин Роман
Рогозин Роман

Отправить комментарий

Можно применять теги: <b></b><i></i><br />
<br />


Доска почета

Плюсани блог!