Как сделать всплывающий баннер в Blogger

Как сделать всплывающий баннер в Blogger


Данный код  не имеет обладает одновременно двумя особенностями - таймером (картинка без необходимости нажимать на 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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEE5eqwEkWjMMkelNvaCdgDJE09oGe4xTcJ1kA4kSXisn7DajlTN5bqacCliblpLDEJTFSmxuOWT81hlO5F1pi1AEzKUZG7za1AjYvi9PaqGWx2CwChksodozOJqetRj8tu6IgqRZrJCE/s1600/cooltext868333624.png" width="490" /></span></center></div> </div>

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

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

Комментариев нет: