Jak uruchomić zakładki jquery ui?

Question

Na stronie http://docs.jquery.com/UI/Tabs#Example znajduje się krótki przykład HTML korzystania z kart interfejsu JQuery.

• Umieściłem kod HTML w lokalnym pliku index.htm.
• Pobrałem wszystkie pliki CSS i Javascript i zapisałem je w plikach lokalnych:
• , ale najbliżej mogę uzyskać ten sam przykład bez żadnego koloru w zakładkach.
• Szukałem zdjęć itp., Ale nie mogę ich znaleźć.
• Mogę nawet mieć wszystko lokalne Z WYJĄTKIEM pliku CSS, który dostaję z ich serwera i TO działa, więc jest to coś w pliku CSS, którego nie otrzymuję.

Co nie kopiuję lokalnie, że plik CSS online ma? Czy ktoś dostał karty interfejsu JQuery UI do pracy i ma plik ZIP, który działa lokalnie?

Answer 1

Aby zakładki interfejsu użytkownika działały, POTRZEBUJESZ niektórych CSS. Dokumentacja określa wymagane minimum.

Problem z motywem przykładowym polega na tym, że używany plik css odwołuje się do innych plików CSS. Musisz skopiować je wszystkie lokalnie. Potrzebujesz również obrazka w folderze themes/flora/i.

Answer 2

Jeśli Twoim problemem jest to, że wszystko wydaje się działać, ale DIV nie znikają tak, jak powinny, prawdopodobnie wpadłeś na ten sam problem co ja.

Musisz zdefiniować klasę .ui-tabs-hide, aby ukryła element. Zasadniczo jQuery używa tego do ukrywania elementów, zamiast robić to ręcznie za pomocą wyświetlacza: brak. Powodem tego jest to, aby nie zepsuł się z domyślnym ustawieniem ekranu, które może być blokowe, inline lub cokolwiek innego. Dodanie i usunięcie klasy daje większą kontrolę.

.ui-tabs-hide 
{ 
    display: none 
} 

Answer 3

Miałem ten sam problem, dlatego jestem tutaj i zajęło mi trochę czasu, aby znaleźć problem. Dzięki kgiannakakis odpowiedzieć CSS znalazłem na stronie jQueryUI ten CSS w kodzie źródłowym:

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

Dodaj ją przed głównym CSS jak to na przykład:

A potem powinno być dobrze - to działa dla mnie.