2014-10-02 4 views
1

У меня возникла проблема с отображением меню выпадающего меню, которое должно отображаться в моем браузере. код выглядит следующим образомсоздание выпадающего меню с jQuery

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jquery test</title> 

<style> 
#webmenu{ 
width:340px; 
} 

</style> 
</head> 

<body> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(window).load(function() { // makes sure the whole site is loaded 
$("body select").msDropDown(); 
    }) 
</script> 


<select name="webmenu" id="webmenu"> 
<option value="calendar" title="http://www.abe.co.nz/edit/image_cache/Hamach_300x60c0.JPG"></option> 
<option value="shopping_cart" title="http://www.nationaldirectory.com.au/sites/itchnomore/thumbs/screenshot2013-01-23at12.05.50pm_300_60.png"></option> 
<option value="cd" title="http://www.mitenterpriseforum.co.uk/wp-content/uploads/2013/01/MIT_EF_logo_300x60.jpg"></option> 

</select> 

</body> 
</html> 

Я нашел исходный код на GitHub в http://jsfiddle.net/GHzfD/357/, но не был в состоянии воспроизвести его - я делаю какой-то фундаментальной ошибки?

Страница находится в прямом эфире на http://www.datatrouble.com/jquery_test.html

+0

пытаются intialise 'msDropDown()' 'внутри document.ready()' вместо 'window.load' –

+0

Я сделал это, но не повезло, что я не боюсь – user2840467

ответ

1

Отсутствующие msdropdown плагинов

msdropdown н css

Включите этот код Befor вы звоните msdropdown

<link rel="stylesheet" href="http://www.marghoobsuleman.com/mywork/jcomponents/image-dropdown/samples/css/msdropdown/dd.css> 
<script src="http://www.marghoobsuleman.com/mywork/jcomponents/image-dropdown/samples/js/msdropdown/jquery.dd.min.js"></script> 

в jsFiddle эти внешние ссылки включены также на левой панели - снимок.

enter image description here

чтения Также What is the difference between $(window).load and $(document).ready?

Update после комментария OP в

Вы размещаете msdropdown плагин, прежде чем вы включили JQuery файл.

msdropdown является плагином jQuery, поэтому файл jQuery должен быть добавлен до вызова сценария плагина.

поэтому он должен выглядеть следующим образом: -

положить scripts на bottom страницы и css на top улучшить скорость загрузки страницы.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="http://www.marghoobsuleman.com/mywork/jcomponents/image-dropdown/samples/js/msdropdown/jquery.dd.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $("body select").msDropDown(); 
    }); 
</script> 
+0

я не понял, что есть отсутствующие внешние ссылки! Спасибо за это - я внес эти изменения в код, а также поместил его в $ (document). Уже после прочтения статьи. Я дважды проверял URL-адреса внешних ссылок, и они кажутся прекрасными, но они все еще не работают. Могли бы вы предложить дополнительную помощь, пожалуйста? – user2840467

+1

@ user2840467 проверить обновленный ответ. :) –

+1

Спасибо, столько же Тушара! Вот и все. Я новичок в jQuery, и именно эти основы я нахожу расстраивающим. Я оглянусь назад и пойму, какой из новичков я был :) – user2840467