Jquery Sample - Draconmedia, LLC.

<

<!doctype html> <html> <title>Jquery examples </title> <head> <style> body{ background:url('style/bgpic1.jpg'); } #slider-wrapper {width:500px; height:200px;} #slider {width:500px; height:200px; position:relative;} .sp {width:500px; height:200px; position:absolute;} #nav {margin-top:20px; width:100%;} #button-previous {float:left;} #button-next {float:right;} </style> <script language="JavaScript" type="text/javascript"> $(document).ready(function(){ $('.sp').first().addClass('active'); $('.sp').hide(); $('.active').show(); $('#button-next').click(function(){ $('.active').removeClass('active').addClass('oldActive'); if ( $('.oldActive').is(':last-child')) { $('.sp').first().addClass('active'); } else{ $('.oldActive').next().addClass('active'); } $('.oldActive').removeClass('oldActive'); $('.sp').fadeOut(); $('.active').fadeIn(); }); $('#button-previous').click(function(){ $('.active').removeClass('active').addClass('oldActive'); if ( $('.oldActive').is(':first-child')) { $('.sp').last().addClass('active'); } else{ $('.oldActive').prev().addClass('active'); } $('.oldActive').removeClass('oldActive'); $('.sp').fadeOut(); $('.active').fadeIn(); }); }); </script> </head> <body> <div align="center" id="wrapper"> <table border="3" width="800" height="240" > <tr><td valign="top"> <p><font color="grey">This is an example page for jquery</font></p> <div id="slider-wrapper"> <div id="slider"> <div class="sp"> <img src="style/dh.jpg" alt="dh" width="140" height="140"> </a></div> <div class="sp"> <img src="style/ariel.jpg" alt="ariel" width="140" height="140"> </a></div> <div class="sp"> <img src="style/cyn.jpg" alt="cyn" width="170" height="140"> </a></div> <div class="sp"> <img src="style/dragon.jpg" alt="dragon" width="140" height="170"> </a></div> </div> </div> <div id="nav"></div> <div id="button-previous">prev</div> <div id="button-next">next</div><br/><br/> </td></tr></table></div> <div id="pageFooter"><a href="http://www.draconmedia.com"> <li>Draconmedia,LLC.</a></li> </div> </div> </body> </html>

Jason is a custom website developer and graphic designer with extensive experience in computer software scripting, computer animation, and customer service. His current focus on creating websites and creating e-commerce stores is preceded by 10 + years in software development, and eight years in the U.S. Navy.

Sample Codes

HTML

Css

Javascript

jQuery

Ajax

PHP

Contact Details
News Letters