Posts
Showing posts from December, 2014
News website design, lalit nishad web designer, tutorial points & web design ideas
- Get link
- X
- Other Apps
Slide Toggle menu, tutorial blog
- Get link
- X
- Other Apps
<header> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript"> function showonlyone(thechosenone) { $('.newboxes').each(function(index) { if ($(this).attr("id") == thechosenone) { $(this).slideToggle( "slow"); } else { $(this).hide(0); } }); } </script> </header> <body> <div style="width:100%; height:auto; float:left;"> <div style="border: 1px solid blue; background-color: #99CCFF; float:left; padding: 5px; width: 150px;"> <a id="myHeader1" href="javascript:showonlyone('newboxes1');" >show this one only</a> </div> <div style="border: 1px solid blue; background-color: #99CCFF; fl
image checkbox use css, checkbox tutorial
- Get link
- X
- Other Apps
<style> .amPmCheckbox input[type="checkbox"] { display: none; width:20px; height:auto; float:left; } .amPmCheckbox input[type="checkbox"]+label { background: url('http://renegadeox.com/img/off.png') no-repeat; height:17px; padding-left: 18px; float:left; } .amPmCheckbox input[type="checkbox"]:checked + label { background: url('http://renegadeox.com/img/on.png') no-repeat; height:17px; float:left; } .amPmCheckbox1 input[type="checkbox"] { display: none; width:20px; height:auto; float:left; } .amPmCheckbox1 input[type="checkbox"]+label { background: url('37.gif') no-repeat; height:17px; padding-left: 18px; float:left; } </style> <div class="amPmCheckbox"> <input type="checkbox" name="data[Child][remember_me]" class="checkboxLabel main_street_input image" id="am_
Java script link & image hover effect
- Get link
- X
- Other Apps
(mouse over link) onmouseover="this.style.color='yellow'" onmouseout="this.style.color='white'" --------------------------------------------------------------------------------------------------------------------------- (mouse over image) onmouseover="this.src='images/nifa-classes_03.jpg'" onmouseout="this.src='images/nifa-classes_02.jpg'"
HTML Flash Script
- Get link
- X
- Other Apps
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="131" height="75" id="FlashID2" title="tower"> <param name="movie" value="images/web_tower.swf" /> <param name="quality" value="high" /> <param name="wmode" value="opaque" /> <param name="swfversion" value="6.0.65.0" /> <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. --> <param name="expressinstall" value="Scripts/expressInstall.swf" /></object> <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. --> <!--[if !IE]>--> <object type
CSS Gradient style
- Get link
- X
- Other Apps
.gradient-bg { background-color: #1a82f7; background-image: url(images/fallback-gradient.png); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#2F2727), to(#1a82f7)); background-image: -webkit-linear-gradient(top, #2F2727, #1a82f7); background-image: -moz-linear-gradient(top, #2F2727, #1a82f7); background-image: -ms-linear-gradient(top, #2F2727, #1a82f7); background-image: -o-linear-gradient(top, #2F2727, #1a82f7); }
Page loader jquery
- Get link
- X
- Other Apps
<style> .loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url('../images/loading.gif') 50% 50% no-repeat black; } </style> <body> <div class="loader"> </div> <script type="text/javascript" src="js/jquery.min.js"></script> <script src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(window).load(function () { $(".loader").fadeOut("slow"); }) </script> </body>
popup box loader jquery
- Get link
- X
- Other Apps
<head runat="server"> <title>Untitled Page</title> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" /> <!-- you can have your own style --> <style> body { font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif"; font-size: .8em; } /* dialog div must be hidden */ #basicModal{ display:none; } </style> </head> <body> <!-- sample content in your page --> <div>You can click the button.</div> <input type='button' value='Click here' id='showDialog' /> <!-- -this time, we don't have the dialog html in the body, it is in another url -we use the image loa