survey website design idea lalit nishad
Posts
Slide Toggle menu, tutorial blog
<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 s...
image checkbox use css, checkbox tutorial
<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; } ...
Java script link & image hover effect
(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
<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" /></obje...
CSS Gradient style
.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
<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
<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{ ...
Font Property in CSS
The font property can set the style, weight, variant, size, line height and font: font-family: 'Font Name'; src: url('../fonts/fontname-webfont.eot'); src: url('../fonts/fontname-webfont.eot?iefix') format('eot'), url('../fonts/fontname-webfont.woff') format('woff'), url('../fonts/fontname-webfont.ttf') format('truetype'), url('../fonts/fontname-webfont.svg#webfontjSpbZQRv') format('svg'); font-weight: normal; font-style: normal;
Use Backgroung Video Tutorial
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Page</title> <style> body{ margin:0px; background:#000; } #bg_container{ height:500px; overflow:hidden; } #bg{ width:100%; height:100%; } #content{ position:absolute; top:0px; padding:30px; color:#FFF; text-shadow:#000 2px 2px; } </style> </head> <body> <div id="bg_container"> <iframe id="bg" src="//www.youtube.com/embed/NnFQy49mank?autoplay=1&controls=0&loop=1&showinfo=0&modestbranding=1&disablekb=1&enablejsapi=1&" frameborder="0" allowfullscreen></iframe> </div> <div id="content"> <h1>Hello</h1> <h2>I Am a web designer</h2> </div> </body> ...
.noConflict() Script
I know that I need to run jQuery in .noConflict() mode, but I must be getting the syntax wrong. When I assign the $ to jQuery .noConflict as follows, it still shuts down the script.aculo.us functions: </script> <script type="text/javascript"> var $j = jQuery.noConflict(); <------------------------------ -Use this line and use variable name $j(document).ready(function() { $j('.sf-menu ul').superfish({ delay: 1000, animation: {opacity:'show',height:'show'}, speed: ...
