Friday, October 26, 2012

jquery tabs



    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css" type="text/css" rel="Stylesheet" />
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $("#mytab").tabs();
    });
    </script>


<div id="mytab" style="display:block">
<ul>
        <li><a href="#tabs-1">Step 1</a></li>
        <li><a href="#tabs-2">Step 2</a></li>
        <li><a href="#tabs-3">Step 3</a></li>
    </ul>
    <div id="tabs-1">
        <input type="text" class="required" name="step1" id="step1" />
    </div>
    <div id="tabs-2">
        <input type="text" class="required" name="step2" id="step2" />
    </div>
    <div id="tabs-3">
        <input type="text" class="required" name="step3" id="step3" />
        <input type="submit" name="submit" value="Submit" />
    </div> 
        </div>  

No comments:

Post a Comment