jqueryui
Thursday 26 February 2015
JqueryUI Tabs
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Tabs</title> <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <script> $(function() { $( "#tabs-1" ).tabs(); }); </script> <style> #tabs-1{font-size: 14px;} .ui-widget-header { background:#333; border: 1px solid #b9cd6d; color: #FFFFFF; font-weight: bold; } .ui-tabs .ui-tabs-panel { background:#ccc; border-width: 0; display: block; padding: 1em 1.4em; } </style> </head> <body> <div id="tabs-1"> <ul> <li><a href="#tabs-2">Test1</a></li> <li><a href="#tabs-3">Test2</a></li> <li><a href="#tabs-4">Test3</a></li> </ul> <div id="tabs-2"> <p>Result1 </p> </div> <div id="tabs-3"> <p>Result2</p> </div> <div id="tabs-4"> <p>result3</p> </div> </div> </body> </html>
No comments:
Post a Comment
Newer Post
Older Post
Home
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment