swagatam.css

::selection{background-color:orange}a{text-decoration:none;color:#000;transition:color 2s}a:hover{color:#fff}
#sw_windowBox{display:none;position:fixed;top: 0;left: 0;width: 100%;height: 100%;background-color:#000;opacity:0.5;z-index: 9999;border-radius:10px;}#sw_widgetBox{z-index:9999;position:fixed;width:500px;height:500px;background-color:#F2F2F2;opacity:1;display:none;top:50px;left:400px;border-radius:50px 0 50px 0;box-shadow:0 0 40px #000;-moz-box-shadow:0 0 40px #000}#sw_widgetBox .head{cursor:pointer;width:500px;height:60px;background-color:#000;border-radius:50px 0 0 0;box-shadow:0 4px 10px #333;-moz-box-shadow:0 1px 7px #333;overflow:hidden}#sw_widgetBox .head .heading{color:#fff;text-align:center;font-size:35px;line-height:60px}#sw_widgetBox .content{width:500px;height:380px}#sw_widgetBox .sw_foot{width:500px;height:60px;background-color:#000;border-radius:0 0 50px 0}#sw_widgetBox .sw_foot ul{list-style-type:none}#sw_widgetBox .sw_foot li{display:inline;color:#fff;font-size:30px;width:40px;margin-left:5px;line-height:60px;overflow:hidden}#sw_widgetBox .sw_foot .socialLinks{line-height:60px;color:#fff;font-size:33px;font-weight:700;padding-left:10px;float:left;width:21px;overflow:hidden;margin-left:0;cursor:pointer;height:60px;}#sw_widgetBox .sw_foot #id0{background-color:#3b5998;transition:width 1s}#sw_widgetBox .sw_foot #id0:hover{width:29%}#sw_widgetBox .sw_foot #id1{width:23px;background-color:#9ae4e8;transition:width 1s}#sw_widgetBox .sw_foot #id1:hover{width:22%}#sw_widgetBox .sw_foot #id2{width:24px;background-color:#fff;color:#000;transition:width 1s}#sw_widgetBox .sw_foot #id2:hover{width:26%;animation:gplus 5s;-webkit-animation:gplus 5s}#sw_widgetBox .sw_foot .sw_closeWidget{float:right;color:#000;font-size:30px;background-color:#fff;border-radius:100px;margin-right:30px;width:30px;text-align:center;margin-top:10px;transition:background-color 2s,color 2s,width 1s}#sw_widgetBox .sw_foot .sw_closeWidget:hover{background-color:red;color:#fff;width:50px}#sw_widgetBox .content .socialBox{overflow:hidden;width:465px;height:315px;border-style:solid;border-width:1px;margin-left:17px;margin-top:10px;border-color:transparent}#sw_widgetBox .content .socialBox .sw_box1{display:none;width:inherit;height:inherit;background-color:transparent;float:left}#sw_widgetBox .content .socialBox .sw_box2{width:inherit;height:inherit;background-color:transparent;float:left;display:none}#sw_widgetBox .content .socialBox .sw_box3{width:inherit;height:inherit;background-color:tranparent;float:left;display:none}div.clear{clear:both}@keyframes gplus{0%{background:red;color:#fff}25%{background:#ff0;color:#fff}50%{background:blue;color:#fff}100%{background:green;color:#fff}}@-webkit-keyframes gplus{0%{background:red;color:#fff}25%{background:#ff0;color:#fff}50%{background:blue;color:#fff}100%{background:green;color:#fff}}@keyframes widgetbg{0%{background:red;color:#fff}25%{background:#ff0;color:#fff}50%{background:blue;color:#fff}100%{background:green;color:#fff}}@-webkit-keyframes widgetbg{0%{background:red;color:#fff}25%{background:#ff0;color:#fff}50%{background:blue;color:#fff}100%{background:green;color:#fff}}div.sw_foot input[type="email"]{color:#333;float:left;margin-left:5px;height:40px;border-radius:20px 0 0 20px;border-style:none;margin-top:10px;width:170px;outline:0;transition:width 1s;font-size:13px;font-style:italic}div.sw_foot input[type="email"]:hover{width:250px;font-style:none}div.sw_foot input[type="email"]:focus{font-size:20px}div.sw_foot input[type="image"]{height:40px;margin-top:10px;background-color:#fff;border-radius:0 20px 20px 0;float:left}@keyframes heading{0%{color:cyan}25%{color:#ff0}50%{color:green}75%{color:pink}100%{color:orange}}@-webkit-keyframes heading{0%{color:cyan}25%{color:#ff0}50%{color:green}75%{color:pink}100%{color:orange}}#sw_widgetBox .head .heading:hover{animation:heading 15s;-webkit-animation:heading 15s}#sw_widgetBox .content .shareBox{width:500px;height:65px;overflow:hidden;box-shadow:0 -2px 8px #000;-moz-box-shadow:0 -2px 8px #000}#sw_widgetBox .content .shareBox .share_box1{width:inherit;height:inherit;background-color:#3b5998;display:-ms-flexbox;-ms-flex-pack:center;-ms-flex-align:center;display:-moz-box;-moz-box-pack:center;-moz-box-align:center;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;display:box;box-pack:center;box-align:center}#sw_widgetBox .content .shareBox .share_box2{width:inherit;height:inherit;background-color:#9ae4e8;display:none;display:-ms-flexbox;-ms-flex-pack:center;-ms-flex-align:center;display:-moz-box;-moz-box-pack:center;-moz-box-align:center;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;display:box;box-pack:center;box-align:center}#sw_widgetBox .content .shareBox .share_box3{width:inherit;height:inherit;background-color:#fff;display:none;display:-ms-flexbox;-ms-flex-pack:center;-ms-flex-align:center;display:-moz-box;-moz-box-pack:center;-moz-box-align:center;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;display:box;box-pack:center;box-align:center}
#sw_box{width:453px;height:300px;overflow:hidden;background:#00A1FF;box-shadow:0px 0px 10px #000;-moz-box-shadow:0px 0px 10px #000;position:absolute; left:25px;font-size:70px; color:white;}.sw_load_1{width:145px;height:230px;background:red;float:left;border-style:solid;border-color:#F2F2F2;animation: sw_load_1 2s;-webkit-animation: sw_load_1 3s infinite;}.sw_load_2{width:145px;height:230px;background:red;float:left;border-style:solid;border-color:#F2F2F2;animation: sw_load_2 2s;-webkit-animation: sw_load_2 3s infinite;}.sw_load_3{width:145px;height:230px;background:red;float:left;border-style:solid;border-color:#F2F2F2;animation: sw_load_3 2s;-webkit-animation: sw_load_3 3s infinite;}@keyframes sw_load_1{0% {background:white;}}@-webkit-keyframes sw_load_1{20% {background:white;}50% {background:red;}100% {background:red;}}@keyframes sw_load_2{0% {background:white;}}@-webkit-keyframes sw_load_2{20% {background:red;}50% {background:white;}100% {background:red;}}@keyframes sw_load_3{0% {background:white;}}@-webkit-keyframes sw_load_3{ 60% {background:red;}80% {background:white;}100% {background:red;}}
.sw_announce{display:none;z-index:9999;width:453px;height:300px;overflow:auto;background:#000;opacity:0.9;box-shadow:0px 0px 10px #000;-moz-box-shadow:0px 0px 10px #000;position:absolute; left:25px;font-size:70px; color:white;}
.sw_announce_msg{font-size:20px;font-style:italic;font-weight:bold;padding:0px;}.sw_announce_msg strong{font-size:25px;font-style:italic;padding:0px;}@keyframes sw_notifi{0%{width:60px;height:60px;font-size:45px;margin-top:50px;}25%{width:55px;height:55px;font-size:40px;}50%{width:60px;height:60px;font-size:45px;margin-top:10px;}75%{width:55px;height:55px;font-size:40px;}100%{width:60px;height:60px;font-size:45px;margin-top:50px;}}@-webkit-keyframes sw_notifi{0%{width:60px;height:60px;font-size:45px;margin-top:50px;}25%{width:55px;height:55px;font-size:40px;}50%{width:60px;height:60px;font-size:45px;margin-top:10px;}75%{width:55px;height:55px;font-size:40px;}100%{width:60px;height:60px;font-size:45px;margin-top:50px;}}#sw_notifi{font-size: 45px;color: white;float: left;width: 60px;background: red;height: 60px;margin-left: 20px;border-radius: 100px;font-weight: bold;text-align: center;line-height: 60px;display:none;animation:sw_notifi 2s;-webkit-animation:sw_notifi 2s infinite;}.sw_announce_header{width:100%;height:auto;background:red;text-align:center;display:none;overflow:hidden;}

swagatam.html

 <div id="sw_windowBox"> </div> <div id="sw_widgetBox"> <div class="head"><span id="sw_notifi">1</span><div class="heading" id="sw_heading"> <script>document.write(swaGatam.title)</script></div> </div> <div class="content"> <div class="socialBox"> <div class="sw_announce"> <div class="sw_announce_msg"><div class="sw_announce_header"><script>document.write(swaGatam.announceHeader);</script></div> <strong>"</strong> <script>document.write(swaGatam.announce);</script> <strong>"</strong> </div> </div> <div id = "sw_box"> (( LOADING )) <div class="sw_load_1"></div> <div class="sw_load_2"></div> <div class="sw_load_3"></div> </div> <div class="sw_box1"> <!--FACEBOOK LIKE BOX --> <!--SET_UP[1]--> <script> document.write('<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2F'); document.write(swaGatam.facebookPage); document.write('&amp;width=455&amp;height=300&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false&amp;appId='+swaGatam.appId+'" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:455px; height:300px;" allowTransparency="true"></iframe>'); </script> <!--END---> </div> 
     <!--TWITTER TIMELINE--> <!--SET_UP[2]--> <div class="sw_box2">
	    <script> document.write('<a class="twitter-timeline" href="https://twitter.com/'); document.write(swaGatam.twitter+'" data-widget-id="'+swaGatam.twitterWidgetId+'">Tweets by @'+swaGatam.twitter+'</a>'); !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div><!--END---><div class="sw_box3"> <!--GOOGLE PLUS PAGE BADGE---> <!--SET_UP[3]--> <script>if(swaGatam.gplusType == 'page'){ document.write('<div class="g-page" data-width="450" data-href="//plus.google.com/'+swaGatam.gplus+'" data-rel="publisher"></div>');}else{ document.write('<div class="g-person" data-width="450" data-href="//plus.google.com/'+swaGatam.gplus+'" data-rel="author"></div>'); } </script> <!-- Place this tag after the last widget tag. --><script type="text/javascript"> (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();</script><!--END---> </div> </div> <div class="shareBox"> <div class="share_box1"><!--LIKE AND RECOMMEND BOX---><script>document.write('<div class="fb-like" data-href="');document.write(window.location.href+'" data-width="450" data-layout="button_count" data-show-faces="true" data-send="true"></div>'); </script> <!---END--></div> <div class="share_box2"><!--TWITTER SHARE AND FOLLOW---><!--SET_UP[4]--><script>document.write('<a href="https://twitter.com/share" class="twitter-share-button" data-via="'+swaGatam.twitter+'" data-dnt="true">Tweet</a>');document.write('<a href="https://twitter.com/'+swaGatam.twitter+'" class="twitter-follow-button" data-show-count="false" data-dnt="true">Follow @'+swaGatam.twitter+'</a>'); </script><!--END---></div> <div class="share_box3"><!--GOOGLE PLUS SHARE AND FOLLOW---><!--SET_UP[5]--><div class="g-plusone" data-size="medium"></div><div class="g-plus" data-action="share" data-annotation="bubble"></div><!--END---></div> </div> </div> <div class="sw_foot"> <!--HOVER EFFECTS TABS---> <script> var socialLink = new Array("Facebook","Twitter","Google+"); for(var key in socialLink){ document.write('<div class="socialLinks" id="id'+key+'" onmouseover="swaGatam.doThis('+key+')">'); document.write(socialLink[key]); document.write('</div>'); } </script> <!--END---><div class="sw_subscribeForm"> <!--SUBSRIBE TAB---> <input type="email" name="email" autocomplete="off"placeholder=" Enter Your email to subscribe..." id="emailInput"/><input type="image" src="https://lh4.googleusercontent.com/-qpuDVmtG84I/Ug2lwGOEnzI/AAAAAAAAAI8/y_zuTK38X7A/s24-no/rss.jpg"name="submit"/></div> <!---END--> <div class="sw_closeWidget"><a href="#">x</a></div> </div> </div> </div></div>

swagatam.js

/* @AUTHOR: SAMUNDRA KC;
  * @EMAIL:  SAMUNDRAK@YAHOO.COM;
  * @URL:    WWW.SAMUNDRA.ME
  *   
  */
var swaGatam ={
/*SET THIS SETTING ACCORDING TO YOUR DATA THIS IS DEFAULT
DATA AND WILL BE SHOWN DEFAULT IF WON'T EDIT THIS*/
//TITLE OF SWAGATAM BAR
title: "Please Like Our Social Page!",

//THIS IS ANNOUNCE MENT MESSAGE!
announce: "elu TODAY WE ARE GOING TO LAUNCH OUR NEW POPUP .. HOW IS THIS POP UP HOPE IT IS NICE!",

//THIS IS ANNOUNCEMENT HEADER 
announceHeader: "We Welcome You To Our Website.",
 
//HOW MUCH TIMES YOU WANT TO SHOW SWAGATAM USER PER DAY
limit: 500,
 
//HIDE SWAGATAM WHILE CLICKED ON BLACK PART
outClick:"OFF",
 
//HIDE SWAGATAM WHILE "ESC" KEY PRESSED ON KEYBOARD
escClick:"ON",
 
//APP ID OF FACEBOOK APPLICATION
appId:"533938673327493",
 
//YOUR TWITTER USERNAME
twitter:"samundrak",
 
/*YOUR TWITTER TIME WIDGET ID
  YOU WILL GET THIS HERE https://twitter.com/settings/widgets/new
  YOU WILL GET ID WHEN YOU WILL GENERATE ID BY CLICKING CREATE WIDGET
  SEE DATA-WIDGET-ID IN GENERATED CODE AND ENTER CODE ONLY HERE.
*/
twitterWidgetId:"368311442044239872",
 
//YOUR FACEBOOK PAGE USERNAME
facebookPage:"facebook",
 
//GOOGLE PAGE OR PERSON?
gplusType : "person",
 
/*THIS IS YOUR GOOGLE PLUS ID FOR PAGE/PERSON
  IT WILL BE LIKE THIS WHILE VISITING YOUR PROFILE IN GOOGLE PLUS
  PLUS.GOOGLE.COM/YOUR_GPLUS_CODE*/
gplus:"106278275837591205389",
 
popMeUp: function(){ if(this.checkSet(5) == 1){$('#sw_windowBox').fadeIn(1500); $('#sw_widgetBox').slideDown(1500); $(document).ready(function(){$("body").keyup(function(){swaGatam.escClick == "OFF" ? null : whichButton(event); });});closeThisShit(".sw_closeWidget");this.outClick == "OFF" ? null : closeThisShit("#sw_windowBox");function closeThisShit(x){$(document).ready(function(){$(x).click(function(){hideIt();});});}function whichButton(event) {var key = event.keyCode;if(key == 27){hideIt();}}$(document).ready(function(){$(".heading").mouseover(function(){for(var x = 0; x <= 10; x++){ $(".heading").animate({marginLeft:"20px"}); $(".heading").animate({marginLeft:"-20px"}); } }); });$(document).ready(function(){ $(".heading").mouseout(function(){ $(".heading").stop(true); });}); }function hideIt(){ $('#sw_windowBox').fadeOut(1500); $('#sw_widgetBox').fadeOut(1500);}},
doThis: function(x){ switch(x){ case 0: $(".sw_box2").hide(1000); $(".sw_box1").show(1000); /*$("#sw_widgetBox").css({"transition":"background 2s","background-color":"#3b5998"});*/ $(".sw_box3").hide(1000); $(".share_box2").hide(1000); $(".share_box1").show(1000); $(".share_box3").hide(1000); $("#sw_box").hide(1500); break; case 1: $(".sw_box1").hide(1000); $(".sw_box2").show(1000); /*$("#sw_widgetBox").css({"transition":"background 2s","background-color":"#9AE4E8"});*/ $(".sw_box3").hide(1000); $(".share_box1").hide(1000); $(".share_box2").show(1000); $(".share_box3").hide(1000); $("#sw_box").hide(1500); break; case 2: $(".sw_box2").hide(1000); $(".sw_box3").show(1000); /* $("#sw_widgetBox").css({"animation":"widgetBg 5s","-webkit-animation":"widgetBg 5s"}); $("#sw_widgetBox").css({"transition":"background 2s","background-color":"white"});*/ $(".sw_box1").hide(1000); $(".share_box2").hide(1000); $(".share_box3").show(1000); $(".share_box1").hide(1000); $("#sw_box").hide(1500); break; } },
checkSet: function(x){ if(typeof(Storage)!=="undefined") { var d = new Date(); var day = d.getDate(); checkData = localStorage.checkData; if(checkData){ $today = checkData[0]+checkData[1]; $show = checkData[3]; if($show == this.limit && $today == day){ return 0; }else{ if($today == day){ $showPlus = parseInt($show) + 1;localStorage.checkData = [day,$showPlus];return 1; }else{ localStorage.checkData = [day,1];return 1; } } }else{ localStorage.checkData = [day,1];return 1; } } },}
$(document).ready(function(){ $("body").keyup(function(){ isEnter(event); }); });function isEnter(event){pressKey = event.keyCode; if($("input")[0] == document.activeElement) {if(pressKey == 13){ valu = $("#emailInput").val(); if (validateEmail(valu)) { swaGatam.email = valu; window.open('http://feedburner.google.com/fb/a/mailverify?uri='+window.location.host, 'popupwindow', 'scrollbars=yes,width=550,height=520'); }else{ console.log("ERROR INCORRECT EMAIL!"); } }} }
function validateEmail(email) { /* CREDIT: http://stackoverflow.com/a/46181/11236*/
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
$(document).ready(function(){ swaGatam.popMeUp(); });(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ne_NP/all.js#xfbml=1&appId="+swaGatam.appId; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));setTimeout(function(){ $("#sw_box").fadeOut(1500); $(".sw_box1").fadeIn(1500);},6000);
$(document).ready(function(){ $(".head").click(function(){ $(".sw_announce").slideToggle(1000); localStorage.alert_msg = '{"sts":"1","msg":"'+swaGatam.announce+'"}'; setTimeout(function(){$("#sw_notifi").fadeOut(1000);},2000); setTimeout(function(){$(".sw_announce_header").slideDown(1000);},3000); $(".sw_announce_header").click(function(){$(".sw_announce_header").slideUp(1000);}); });});$(document).ready(function(){$("#sw_notifi").mouseover(function(){ document.getElementById("sw_heading").innerHTML = "Website Announcement!";$("#sw_notifi").mouseout(function(){ document.getElementById("sw_heading").innerHTML = swaGatam.title; });});});announceAlert(swaGatam.announce);function announceAlert(x){ if(typeof(Storage)!=="undefined"){ var y = localStorage.alert_msg; if(y === undefined){ localStorage.alert_msg = '{"sts":"0","msg":"'+x+'"}'; setTimeout(function(){$("#sw_notifi").fadeIn(1000);},2000); }else{ var z = eval ("(" + localStorage.alert_msg + ")"); if(z.msg === x){ if(z.sts == 0){ setTimeout(function(){$("#sw_notifi").fadeIn(1000);},2000); /*alert('MESSAGE ISNT READ');*/ }else{ /* alert('MESSAGE IS READ');*/ }}else{ localStorage.alert_msg = '{"sts":"0","msg":"'+x+'"}'; setTimeout(function(){$("#sw_notifi").fadeIn(1000);},2000);} } }}