JQuery UI Accordion - Как удалить стиль полностью?

Мне нравится функциональность аккордеона jQuery (http://jqueryui.com/demos/accordion/), но я не хочу стиля!!

Я бы хотел избавиться от всех стилей, img, границы, цвета и т.д.

Я не вижу возможности для этого, это то, что они должны добавить. Или я ошибаюсь?

Ответы

Ответ 1

Вы можете создать свой собственный аккордеон. Использование аккордеона jQuery без интерфейса пользователя бессмысленно. Создание собственного аккордеона, адаптированного к вашему сайту, довольно просто. Вам просто нужно исправить то, как вы хотите его построить... скажем:

<div id='container'>
  <a href='javascript:;'>First link</a>
  <div class='content'>  SOME CONTENT HERE </div>
  <a href='javascript:;'>Second link</a>
  <div class='content'>  SOME CONTENT HERE </div>
  ...
</div>

Затем вам просто нужно сделать что-то вроде

//On click any <a> within the container
$('#container a').click(function(e) {
        //Close all <div> but the <div> right after the clicked <a>
    $(e.target).next('div').siblings('div').slideUp();
        //Toggle open/close on the <div> after the <a>, opening it if not open.
        $(e.target).next('div').slideToggle();
});

Теперь вы можете отредактировать свой класс так, как хотите, поскольку на самом деле они не нужны для JavaScript. Обратите внимание, что с содержимым класса может содержать все, что вы хотите, в том числе, другое или, поскольку .siblings и .next применяются только к одной и той же иерархии.

Ответ 2

Мне нужно (нужно) сделать то же самое. В моем случае я хотел удалить дополнительное дополнение, которое по умолчанию использует css для контента аккордеона, который выглядит следующим образом:

.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }

В MY css я просто добавил это:

 .ui-accordion .ui-accordion-content {padding: 0;}    

Это успешно устанавливает (перегружает) только дополнение.

Rob

Ответ 3

Если вы не заинтересованы в ui-теме (например, мне), тогда не включайте файлы темы css

Ответ 4

Думаю, вы уже решили проблему, так как вы писали в 2010 году. Кстати, теперь можно избежать стилизации каждого виджета ui с помощью панели управления на официальном веб-сайте jqueryUI перед загрузкой темы.

http://jqueryui.com/themeroller/

В случае Accordion просто снимите флажок "Аккордеон" и загрузите сгенерированный файл.

Очень поздно ответить, я знаю, но я думаю, что это может быть полезно... на всякий случай:)

Ответ 5

Обычно вы не делаете этого через js, поэтому нет опции. Вы переопределяете css. Проверьте базу css файл и выполните поиск .ui-accordian.. также будут стили, привязанные к некоторым классам geenral .ui-widget, которые вам необходимо переопределить, Я обычно загружаю его в Firebug и смотрю, что применяется, поэтому я знаю все, что мне нужно, чтобы переодеться, чтобы придать ему внешний вид.

Ответ 6

Забудьте обо всех трюках, переопределениях или других болях.

Вам просто нужно предоставить область css, когда вы загружаете свою тему, например: .jquerythemeon

а затем поместите класс во все элементы, которые хотите быть тематическими

EDIT: Сегодня у меня есть некоторые ошибки с областью, в struct.min.css область всегда создавалась с помощью "jquerythemeon", а не ".querythemeon". Чтобы исправить это, просто замените все вхождения

Ответ 7

Для удаления стиля по умолчанию используйте параметр clearStyle:

 $( ".selector" ).accordion({ clearStyle: true });