Skip to main content

Posts

Showing posts from November, 2015

typeahead static auto suggest

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Typeahead</title> <script  type="text/javascript" src="jquery.min.js"></script> <script  type="text/javascript" src="typeahead.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('input.typeahead').typeahead({ name: 'accounts', local: ["Bangalore","Bidar","Ganagapur","Gulbarga","Raichur"] }); });   </script> <style type="text/css"> .bs-example{ font-family: sans-serif; position: relative; margin: 100px; } .typeahead, .my-query, .my-hint { border: 1px solid #CCCCCC; border-radius: 8px; font-size: 18px; height: px; line-height: 20px; outline: medium none; padding: 8px 12px; width: 240px; } .typeahead { background-color...

auto hide div

<script type="text/javascript">     setTimeout(function() {     $('#msg').fadeOut('fast');     }, 4000); //four seconds </script>  _______________________________________________ <div id="msg"> This alert div auto hide in 4 seconds </div>

Page loader

<html> <head> <style> .no-js #loader { display: none;  } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .preload { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(load.gif) center no-repeat #fff; } </style> </head> <body> <div class="preload"></div> <script src="js/jquery.min.js"></script> <script type="text/javascript"> //paste this code under head tag or in a seperate js file. // Wait for window load $(window).load(function() { // Animate loader off screen $(". preload ").fadeOut("slow");; }); </script> </body> </html>

Onload Popup in HTML

<html> <head>     <link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen" /> </head> <body>   <div class="modal fade" id="myModal" style="padding-top:50px;">     <div class="modal-dialog" >         <div class="modal-content">              <div class="modal-header">                 <button type="button" class="close" data-dismiss="modal">&times;</button>                 <h3><span>Description:</span></h3>              </div>              <div class="modal-body" id="myModal" align="center">                 <p>Lorem Ipsum is simply dummy text of the printing and typesetting indus...

transparent css

body {   font-family: 'Open Sans', sans-serif;   font-size: 14px;   line-height: 45px;   /*color: #666;*/   color: black;   background-color: #fff; } :hover {   text-decoration: none;   outline: none } .form-control {   background-color: transparent;   border-color: black;   height: 50px;   border-radius: 0;   box-shadow: none; } textarea.form-control {   min-height: 180px;   resize:none; } .form-group {   margin-bottom: 30px; } .contact-info {   padding-left:70px;   font-weight: 300; } ul.address {   margin-top: 30px;   list-style: none;   padding: 0;   margin: 0; } .btn-submit {   display: block;   padding: 12px;   width: 100%;   background:transparent;   color: #4985C6;   border:1px solid black;   margin-top: 40px; } .btn-submit:hover {   display: block;   padding: 12px; ...