Wednesday, 16 September 2015

Sign Up Box

<!DOCTYPE html>
<html>
<head>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"></link>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'></script>
<script>
$(document).ready(function(){
  $(".subscribebox").click(function(){
    $($(this).nextAll(".subscribebox-msg")[0]).slideToggle("slow");
  });
});
  </script>
<style>
.supbox{margin: auto; width: 100%; background-color: #e4e4e4;cursor: pointer;}
.sbox{text-align: center;cursor: pointer;}
.submail[type="text"]{width: 95%; border: 1px solid #1d9c73; outline: none;font-size: 16px;padding: 7px;background-color: #fff;border-radius: 3px;color:#1d9c73;cursor: pointer;}
.btn[type="submit"]{width: 97%; border: 1px solid #1d9c73; outline: none; font-size: 16px; padding: 7px; background-color: #1d9c73; border-radius: 3px; color: #fff; margin-top:5px;cursor: pointer;}
.btn:hover{background-color: #1d937c}
.subscribebox-msg{text-align: center; line-height: 20px; background-color: #fff; color: #1d9c73; font-family: sans-serif; font-size:15px; display:none; margin: 0px; border-bottom: 5px solid #1d9c73;}
.sbox-msg{text-align: center; line-height: 20px; background-color: #fff; color: #1d9c73; font-family: sans-serif; font-size:15px; margin: 0px; border-bottom: 5px solid #1d9c73;}
</style>
</head>
<body>
<!--Sign-Up Box-->
<div class="subscribebox">
<p class="sbox-msg"><i class="fa fa-bullhorn"></i>&nbsp;&nbsp; To Get Job Updates <br /><i class="fa fa-quote-left"></i>&nbsp;&nbsp;Sign Up Now &nbsp;&nbsp;<i class="fa fa-quote-right"></i></p>
<table class="supbox">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open(&quot;https://feedburner.google.com/fb/a/mailverify?uri=blogspot/WTEepy&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;); return true" target="popupwindow">
<tbody>
<tr><td class="sbox"><input class="submail" name="email" placeholder="Email address here..." type="text"></td>
</tr><td class="sbox"><button class="btn" type="submit" >Subscribe Me&nbsp;&nbsp;<i class="fa fa-envelope"></i></button>    </td></tr>
</tbody>
<input name="uri" type="hidden" value="blogspot/WTEepy">
<input name="loc" type="hidden" value="en_US">
</form>
</table>
</div>
<div class="subscribebox-msg">
<p><i class="fa fa-smile-o"></i>&nbsp;&nbsp;After Sign-Up <br /><i class="fa fa-quote-left"></i>&nbsp;&nbsp;Please check your inbox for a verification message from&nbsp;&nbsp;FeedBurner Email Subscriptions&nbsp;&nbsp;<i class="fa fa-quote-right"></i></p>
</div>
</body>
</html>