Posts

Showing posts from 2017

right side toggle by js, toggle from ride side by js, toggle js for website, form toggle from right side js, js for form toggle from right side

By -
<!DOCTYPE html> <html lang="en-US"> <head itemscope="" itemtype="https://schema.org/WebSite"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <style> .floating-form {     max-width: 280px;     padding: 20px 20px 10px;     font-size: 13px;     font-family: "Open Sans", sans-serif;     background: #F9F9F9;     border: 1px solid #ddd;     right: -320px;     position: fixed;     box-shadow: -2px -0 8px rgba(43, 33, 33, 0.06);     -moz-box-shadow: -2px -0 8px rgba(43, 33, 33, 0.06);     -webkit-box-shadow: -2px -0 8px rgba(43, 33, 33, 0.06);     z-index: 9999 } .contact-opener {     position: absolute;     left: -80px;     top: 100px;     padding: 9px;     color: #fff;     cursor: pointer; } .floating-form.open {     right:0px; } .floating-form-heading {     font-weight: 700;     font-style: italic;     border-bottom: 2px solid #ddd;     margin-bottom: 10px;     font-size: 15px;   
Post a Comment
Read more

height increase or decrease by click by calling custom class on div

By -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> .actual-height {     background-color: red;     width: 300px;     height: 20px;     overflow:hidden; } </style> </head> <body> <button>Change size!</button> <div class="box actual-height"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iure exercitationem rem labore officia quaerat ea enim magni asperiores quia natus totam dolore quidem quod velit voluptatibus animi adipisci eos distinctio!Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iure exercitationem rem labore officia quaerat ea enim magni asperiores quia natus totam dolore quidem quod velit voluptatibus animi adipisci eos distinctio!Lor
Post a Comment
Read more

div fixed on scroll, scorll js, js for fixed div when scroll

By -
JS:- <script>             jQuery(function($) {   function fixDiv() {     var $cache = $('#getFixed');     if ($(window).scrollTop() > 147)       $cache.css({         'position': 'fixed',         'top': '0px',         'display': 'block'       });     else       $cache.css({         'position': 'relative',         'top': 'auto',         'display': 'none'              });   }   $(window).scroll(fixDiv);   fixDiv(); });         </script> HTML:- <div class="col-md-12" id="getFixed" style="display:none; z-index: 99; background-color: rgb(255, 255, 255); left: 0px; right: 0px; width: 100%;"> </div>
Post a Comment
Read more