2016-04-03 21 views
-1

私はHTMLコードを作成していましたが、セクションにリンクを追加して、特定のjquery UIテーマ "start"にアクセスしました。しかし、なぜjquery UIテーマがレンダリングされていないか、HTMLファイルに適用されていないのかわかりません。JQuery UIテーマがHTMLに適用されていません

ここにコードがあります。

<!doctype html> 
<html> 
<head> 
<link href="http://code.jquery.com/ui/1.10.4/themes/start/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 src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
</head> 
<body> 
<div id = "wrapper"> 

<script type = "text/javascript"> 

$(document).ready(function() { 
    $(".shMenu").menu({ 
     position:{ 
     my: "center top" 
     at: "center bottom" 
    } 

    }); 

}); 




</script> 

<style> 


    #wrapper { 
    width:500px; 
    margin:auto; 
    } 

    .ui-menu { 
    width:15em; 
    } 

    #cartDiv { 
    border-style:solid; 
    border-width:5px; 
    } 








</style> 

<ul class = "shMenu"> 
<li><a href = "Javascript:void(0)">Super Heroes</a></li> 
    <ul> 
     <li><a href = "Javascript:void(0)">Hulk</a></li> 
     <li><a href = "Javascript:void(0)">Batman</a></li> 
     <li><a href = "Javascript:void(0)">Spider-Man</a></li> 
     </li><a href = "Javascript:void(0)">Thor</a></li> 
    </ul> 

<li><a href = "Javascript:void(0)">Comic Books</a></li> 
    <ul> 
     <li><a href = "Javascript:void(0)">Hulk</a></li> 
     <li><a href = "Javascript:void(0)">Batman</a></li> 
     <li><a href = "Javascript:void(0)">Spider-Man</a></li> 
     <li><a href = "Javascript:void(0)">Thor</a></li> 
    </ul> 

</ul> 



<div id = "accordion"> 
<h3>Batman</h3> 
<p>A young Bruce Wayne (Christian Bale) travels to the Far East, 
where he's trained in the martial arts by Henri Ducard (Liam Neeson), 
a member of the mysterious League of Shadows. When Ducard reveals the League's true purpose 
-- the complete destruction of Gotham City -- Wayne returns to Gotham intent on cleaning up the city without resorting to murder. 
With the help of Alfred (Michael Caine), his loyal butler, and Lucius Fox (Morgan Freeman), 
a tech expert at Wayne Enterprises, Batman is born.</p> 
</div> 


<h3>Thor</h3> 
<div> 
<p>As the son of Odin (Anthony Hopkins), king of the Norse gods, 
Thor (Chris Hemsworth) will soon inherit the throne of Asgard from his aging 
father. However, on the day that he is to be crowned, Thor reacts with brutality when the gods' enemies, 
the Frost Giants, enter the palace in violation of their treaty. As punishment, Odin banishes Thor to Earth. While Loki (Tom Hiddleston), 
Thor's brother, plots mischief in Asgard, 
Thor, now stripped of his powers, faces his greatest threat..</p> 
</div> 


<h3>SpiderMan</h3> 
<div> 
<p>"Spider-Man" centers on student Peter Parker (Tobey Maguire) who, 
after being bitten by a genetically-altered spider, gains superhuman 
strength and the spider-like ability to cling to any surface. He vows 
to use his abilities to fight crime, coming to understand the words of his 
beloved Uncle Ben: 
"With great power comes great responsibility."</p> 
</div> 


<div id = "shTabs"> 
<ul> 
    <li><a href = "#ironman">Ironman</a></li> 
    <li><a href = "#hulk">Hulk</a></li> 
    <li><a href = "#thor">thor</a></li> 
    <li><a href = "#spiderman">SpiderMan</a></li> 
</ul> 
</div> 

<div id = "ironman"> 
A billionaire industrialist and genius inventor, Tony Stark (Robert Downey Jr.), 
is conducting weapons tests overseas, but terrorists kidnap him to force him to build a devastating 
weapon. Instead, he builds an armored suit and upends his captors. Returning to America, 
Stark refines the suit and uses it to combat crime and terrorism. 

</div> 

<div id = "hulk"> 
Eric Bana ("Black Hawk Down") stars as scientist Bruce Banner, 
whose inner demons transform him in the aftermath of a catastrophic experiment; 
Jennifer Connelly portrays Betty Ross, whose scientific genius unwittingly helps unleash the Hulk; 
Nick Nolte plays Banner's brilliant father, who passes on a tragic legacy to his son; and Sam Elliott 
portrays the commander of a top-secret military research center. 

</div> 

<div id = "thor"> 
As the son of Odin (Anthony Hopkins), king of the Norse gods, 
Thor (Chris Hemsworth) will soon inherit the throne of Asgard from his aging 
father. However, on the day that he is to be crowned, Thor reacts with brutality when the gods' enemies, 
the Frost Giants, enter the palace in violation of their treaty. As punishment, Odin banishes Thor to Earth. While Loki (Tom Hiddleston), 
Thor's brother, plots mischief in Asgard, 
Thor, now stripped of his powers, faces his greatest threat.. 

</div> 

<div id = "spiderman"> 
"Spider-Man" centers on student Peter Parker (Tobey Maguire) who, 
after being bitten by a genetically-altered spider, gains superhuman 
strength and the spider-like ability to cling to any surface. He vows 
to use his abilities to fight crime, coming to understand the words of his 
beloved Uncle Ben: 
"With great power comes great responsibility." 

</div> 
</div> 


</body> 
</html> 

答えて

0

あなたはmenu()は関数ではありませんブラウザのコンソールにスローされたエラーを取得する必要があります。常にブラウザのコンソールでエラーを確認してください。

これは、jQuery.jsを2回読み込み、2回目の読み込みはjQueryUI.jsを読み込んだ後に効果的に読み込むためです。

のみ負荷jQuery.js一度...とすべての依存プラグインやコードの前に

変更してみてください:

<head> 
    <link href="http://code.jquery.com/ui/1.10.4/themes/start/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 src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
</head> 

<head> 
    <link href="http://code.jquery.com/ui/1.10.4/themes/start/jquery-ui.css" rel="stylesheet"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>  
</head> 

するためにあなたが古いブラウザをサポートするために必要とされている場合 1.xxシリーズのjQuery.jsを使用してください

+0

jqueをロードしていることに気付かなかったry twice.nice tip。 – brxy

関連する問題