html 5 + jquery up and down

contoh potongan source code html 5

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	
	<title>TRY HTML 5</title>
	
	<link rel="stylesheet" type="text/css" href="style/CSS.css" />
	
	<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="style/css/ie8.css" />
<![endif]-->
	
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="style/css/ie.css" />
<![endif]-->
	<script type="text/javascript" src="style/js/jquery-1.4.min.js"></script>

	<script type="text/javascript" src="style/js/jquery.validationEngine.js"></script>
	<script type="text/javascript" src="style/js/jquery.jcarousel.pack.js"></script>
	<script type="text/javascript" src="style/js/junction.js"></script>
	<script type="text/javascript" src="style/js/custom.js"></script>
	

</head>
<body>
<div id="wrapper">
	
  	<div id="page-container">
  		<ul id="page" class="jcarousel-skin-tango">

    		<li> 
    			<span class="content">
      			<h2>Simple up and down</h2>
				<form action="" method="post" id="form-email">
                        <input class="disappear" type="text" name="Newsletter" id="Newsletter" value="Enter your email to subscribe"/>
                        <input type="submit" name="submit" class="submit" value="Submit" />

               	</form><!--end-newsletter-form--> 
				<br/>
      			<a class="control" href="#" onClick="jq.validationEngine.closePrompt('.formError',true)">2</a>
				</span>
   			</li>
    
    
    		<li> 
    			<span class="content">
    				<span class="contact">
     					<form action="" method="post" id="info">
        						<span id="name-wrap" class="slider">
        							<label for="name">Name</label>

        							<input type="text" id="Name" name="Name" class="validate[required] text-input">
       						  	</span>
        						<!--/#name-wrap-->
        						<span id="email-wrap"  class="slider">
        							<label for="email">E&ndash;mail</label>
        							<input class="validate[custom[email]] text-input" type="text" id="Email" name="Email">
        						</span>
       							<!--/#email-wrap-->

        						<span id="comment-wrap"  class="slider">
       								<label for="comment">Comment</label>
        							<textarea class="validate[length[6,300]] text-input" cols="53" rows="10" name="Message" id="Message"></textarea>
       							</span>
        						<!--/#comment-wrap-->
        						<input type="submit" id="btn" name="btn" value="">
      					 </form>
      				</span>
      				
      			</span>
      			<a class="control2" href="#" onClick="jq.validationEngine.closePrompt('.formError',true)">1</a><!--end-second-arrow--> 
      		</li>
 		 </ul>
  		<div class="shadow"></div>
	</div><!--end-page-container-->
</div><!--end-wrapper-->
</body>
</html>

jadinya kayak gini :
up :

down:

source code silahkan comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s