2011-01-22 2 views
3

以下は、タブ付きページを作成するためのHTMLコードです。jQuery tabs()関数がタブを表示しない

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery-ui-1.8.9.custom.min.js"></script> 
    <title>Testing Tabs</title> 
</head> 
<body> 
    <div id="tabs"> 
    <ul> 
     <li><a href="#panel1">Panel 1</a></li> 
     <li><a href="#panel2">Panel 2</a></li> 
     <li><a href="#panel3">Panel 3</a></li> 
    </ul> 
    <div id="panel1"> 
     <p>This is the text of panel 1</p> 
    </div> 
    <div id="panel2"> 
     <p>This is the text of panel 2</p> 
    </div> 
    <div id="panel3"> 
     <p>This is the text of panel 3</p> 
    </div> 
    </div> 
</body> 

私は。タブ()コマンドは、$( '#タブ')を実行する(または$( '#タブ')。タブ({}))FirebugのCommandLineを、本当に何もありませんでつまり、リンクはリンクのままで、すべてのdivが表示されます。

答えて

4

jQueryUIスタイルシートも含めてください。

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/ui-lightness/jquery-ui.css" /> 

例:http://jsfiddle.net/6kg7k/

+0

D'OH!非常に愚か。 – vishakad

関連する問題