Question

我喜欢jQuery手风琴的功能（http://jqueryui.com/demos/accordion/）但是我不想要这种风格!!

我想摆脱所有风格，img，边框，颜色等......

我没有看到这个选项，这是他们应该添加的内容。或者我错了？

Answer 1

你可以制作自己的手风琴。在没有UI的情况下使用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仅适用于同一层次结构。

Answer 2

如果你对ui-theme不感兴趣（像我一样）那么就不要包含主题css文件

Answer 3

我需要（想要）做同样的事情。在我的情况下，我想删除默认css为accordion-content提供的额外填充，如下所示：

.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;}

这成功设置（覆盖）填充。

罗布

Answer 4

我猜你自2010年写完以来就已经解决了这个问题。顺便说一句，现在可以在官方jqueryUI网站上通过控制面板避免每个ui小部件的样式，然后再下载主题。

http://jqueryui.com/themeroller/

如果是Accordion，只需“取消选中”复选框按钮'Accordion'并下载生成的文件。

我知道答案已经很晚了，但我认为它可能有用......以防万一：）

Answer 5

你通常不会通过js这样做，这就是为什么没有选择。你重写css。查看基础css file并搜索.ui-accordian ..还会有一些范围限定为您需要覆盖的某些geenral .ui-widget类的样式。我通常在Firebug中加载它并看看应用的是什么，所以我知道我需要覆盖的所有东西，以给它我的外观和感觉。

Answer 6

忘记所有的伎俩，重写或其他痛苦。

您必须在下载主题时提供css范围，例如： .jquerythemeon

然后将该类放到您想要成为主题的所有元素

编辑：我今天得到了一些带有范围的bug，在structure.min.css中，范围始终是用“jquerythemeon”而不是“.jquerythemeon”生成的。要修复它，只需更换所有出现的

Answer 7

要删除默认样式，请使用clearStyle选项：

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

jQuery UI Accordion - 如何完全删除样式？

7 个答案: