Вкладки JQuery не работают, что мне не хватает?

Я пытаюсь использовать вкладки JQuery, я получил код с сайта: http://docs.jquery.com/UI/Tabs и попробовать его, посмотрите:Вкладки JQuery не работают, что мне не хватает?

<html> 
<head> 
    <script type="text/javascript" src="jquery-1.5.1.js"></script> 
    <script type="text/javascript" src="jquery-ui-1.8.11.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#tabs").tabs(); 
     }); 
    </script> 
</head> 
<body style="font-size:62.5%;"> 

<div id="tabs"> 
    <ul> 
     <li><a href="#fragment-1"><span>One</span></a></li> 
     <li><a href="#fragment-2"><span>Two</span></a></li> 
     <li><a href="#fragment-3"><span>Three</span></a></li> 
    </ul> 
    <div id="fragment-1"> 
     <p>First tab is active by default:</p> 
     <pre><code>$('#example').tabs();</code></pre> 
    </div> 
    <div id="fragment-2"> 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
    </div> 
    <div id="fragment-3"> 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
    </div> 
</div> 
</body> 
</html>

Ничего не происходит. Что мне не хватает?

источник

2012-02-16 Ricksher

устанавливаемых сотового из Jquery-интерфейс – Fox32

@Ricksher - если вы чувствуете, что ни один из ответов помогли вы, пожалуйста, примите его. Это полезно для вас, если вам нужно получить ответы на ваши другие вопросы. – DG3

Вам нужно добавить тему css jquery ui. Посмотрите here («Общий обзор: с помощью jQuery UI на веб-странице»). Положите его в голове теге:

<link type="text/css" href="css/themename/jquery-ui-1.8.17.custom.css" rel="Stylesheet" />

Вы можете выбрать тему по умолчанию или создать вам собственную тему с помощью ThemeRoller

источник

2012-02-16 18:30:47 Fox32

Если я хочу сделать свой собственный css? Что мне нужно сделать? С моими цветами и т. Д. ...? – Ricksher

Взгляните на http://jqueryui.com/themeroller/, чтобы создать свою собственную тему или выбрать тему примера. – Fox32

Вам не хватает стилей. Включите <link href="http://code.jquery.com/ui/1.8.11/themes/base/jquery-ui.css" rel="stylesheet"> перед вашими файлами javascript

Если вы хотите переопределить стиль, вы можете сделать следующее. Например, если вы хотите изменить цвет текста активной вкладки, я вижу, что с помощью хром-инструментов разработчика используются следующие классы. Поэтому я могу переопределить эти классы в моем css

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { 
      color: red !important 
}

источник

2012-02-16 18:30:13 DG3

Если я хочу сделать свой собственный css? Что мне нужно сделать? С моими цветами и т. Д. ...? – Ricksher

Если вы хотите изменить цвет текста вкладок, например, вы можете переопределить этот конкретный класс в вашем файле css и можете использовать! Важно, чтобы ваш стиль вступил в силу. Вы всегда можете получить стиль CSS определенного элемента, проверив его в firebug (если вы используете firefox) или инструменты для создания Chrome. – DG3

В качестве альтернативы, у jquery ui есть инструмент для создания на своем веб-сайте? Вы можете использовать это для создания jquery ui-совместимой темы в соответствии с вашим текущим css. –

Вкладки JQuery не работают, что мне не хватает?

ответ

Смежные вопросы