Created
August 9, 2010 17:49
-
-
Save stresslimit/515782 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
stresspop | |
---------------------------------------------------------------------------- | |
the markup : | |
---------------------------------------------------------------------------- | |
<style> | |
#stresspop { display:none; width:572px; height:286px; | |
background:#fff; | |
position:fixed; | |
top:154px; | |
left:50%; | |
margin-left:-510px; | |
border:16px solid #aa3410; | |
padding:24px 32px; | |
z-index:32768; | |
/* box-shadow:0 0 10px rgba(0, 0, 0, 0.7); -webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.7); -mox-box-shadow:0 0 10px rgba(0, 0, 0, 0.7); */ | |
} | |
#stresspop .close { float:right; cursor:pointer; } | |
#stresspop h1 { font:36px "Minion Pro", Georgia, serif; line-height:36px; color:#aa3410; padding:0; text-transform:uppercase; } | |
#stresspop h2 { font:28px Georgia, serif; color:#3b3b3b; padding:0 0 4px; } | |
#stresspop p { font:16px Georgia, serif; line-height:1.4em; padding:6px 0; } | |
#stresspop p span { color:#aa3410; } | |
#stresspop p.small { font-style:italic; color:#b2aeab; font-size:13px; padding-top:12px; } | |
#stresspop input.email { background:#f9f9f9; border:1px solid #c4c4c4; width:554px; padding:5px 8px; } | |
#stresspop input.subscribe { float:right; margin-top:10px; } | |
</style> | |
<div id="stresspop"> | |
<img class="close" src="http://www.rajeshsetty.com/wp-content/themes/rajeshsetty-v2.0/images/close.gif" alt="X" /> | |
<h1>HELLO THERE AND WELCOME.</h1> | |
<h2>You are a new visitor to this blog.</h2> | |
<p>Here you’ll find more than 1500 articles and mini-sagas on entrepreneurship, leadership, creativity and simply how to distinguish yourself.</p> | |
<p>You <span>REALLY</span> should subscribe to our newsletter too - you will get exclusive content that is NOT featured on this blog once or twice a month.<br />It's even <span>100% free!</span></p> | |
<div class="subscribeForm"> | |
<form action="http://www.aweber.com/scripts/addlead.pl" method="post" target="popupwindow"> | |
<input type="hidden" name="meta_web_form_id" value="792401519" /> | |
<input type="hidden" name="listname" value="rajesh-setty" /> | |
<input type="text" class="email" name="email" alt="Enter your email here" /> | |
<input type="image" class="subscribe" src="http://www.rajeshsetty.com/wp-content/themes/rajeshsetty-v2.0/images/subscribe.gif" value="subscribe" alt="subscribe" /> | |
<p class="small">This message will only appear once.</p> | |
</form> | |
</div> | |
</div> | |
---------------------------------------------------------------------------- | |
the javascript : | |
---------------------------------------------------------------------------- | |
var stresspop = { | |
popup:null, | |
init:function(pop) { | |
stresspop.popup = '#stresspop'; | |
cks = document.cookie.split( ';' ); | |
var parts = ''; | |
var show = true; | |
for(i = 0; i < cks.length; i++){ | |
parts = cks[i].split('='); | |
if ( parts[0].indexOf('stresspopClosed') !== -1 ) { show = false; } | |
} | |
if (show) stresspop.makepop(); | |
}, | |
makepop:function() { | |
jQuery('body').prepend('<div id="stresspop-overlay"></div>'); | |
jQuery('#stresspop-overlay').css({'opacity':0, 'background':'#333', 'position':'fixed', 'top':0, 'left':0, 'width':'100%', 'height':'100%', 'z-index':32767}).animate( | |
{ 'opacity':0.5, 'display':'block' }, | |
800, | |
function() { jQuery(stresspop.popup).show(); } | |
); | |
jQuery(stresspop.popup + ' .close').click( stresspop.close ); | |
jQuery(document).keydown(function(e){ | |
if(e.which == 27){ | |
stresspop.close(); | |
} | |
}); | |
stresspop.bindForm(); | |
}, | |
bindForm:function() { | |
// email form text behaviour | |
jQuery('#stresspop input').each(function(){ | |
if(this.alt){ | |
this.value=this.alt; | |
this.onfocus=function(){if(this.value==this.alt)this.value='' } | |
this.onblur=function(){if(this.value=='')this.value=this.alt } | |
} | |
}); | |
jQuery('#stresspop form').submit(function(e){ | |
chk = new RegExp(/^[a-zA-Z][\w\.-]*[a-zA-Z0-9]*@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/); | |
var email = jQuery('#stresspop .email').val(); | |
if(chk.test(email)) { | |
jQuery.ajax({ | |
'type': 'POST', | |
'url': jQuery('#stresspop form').attr('action'), | |
'data': { | |
'meta_web_form_id':'792401519', | |
'listname':'rajesh-setty', | |
'email': email | |
}, | |
'complete': function(){ | |
jQuery('#stresspop .subscribeForm').html('<h2>Thank you for subscribing!</h2>'); | |
setTimeout(function(){ stresspop.close() }, 2000); | |
} | |
}); | |
} else { | |
alert('Please enter a valid email address'); | |
} | |
return false; | |
}); | |
}, | |
close:function(){ | |
jQuery('#stresspop').hide(); | |
jQuery('#stresspop-overlay').remove(); | |
jQuery(document).unbind('keydown'); | |
var now = new Date(); | |
var expires_date = new Date( now.getTime() + 31536000000 ); | |
document.cookie = 'stresspopClosed=yes;expires=' + expires_date.toGMTString()+';path=/'; | |
} | |
} | |
jQuery(document).ready( stresspop.init ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment