diff options
| author | Jörn Zaefferer <joern.zaefferer@gmail.com> | 2009-01-30 20:42:03 +0000 |
|---|---|---|
| committer | Jörn Zaefferer <joern.zaefferer@gmail.com> | 2009-01-30 20:42:03 +0000 |
| commit | 5484aad00526277a55e0a54fc861b08b2d5660eb (patch) | |
| tree | 1ac4c8c09d93baff2f7b3c2e8f9862e5ef995d0a | |
| parent | 1322a98df99abae1d4bbebe863a2acc10694552c (diff) | |
| download | jquery-ui-5484aad00526277a55e0a54fc861b08b2d5660eb.tar.gz jquery-ui-5484aad00526277a55e0a54fc861b08b2d5660eb.zip | |
accordion: added ul-visual-test; improved solution for fixing ul-accordions, no more potential scope issues
| -rw-r--r-- | demos/accordion/noAutoHeight.html | 3 | ||||
| -rw-r--r-- | tests/visual/accordion/ul.html | 45 | ||||
| -rw-r--r-- | themes/base/ui.accordion.css | 3 | ||||
| -rw-r--r-- | ui/ui.accordion.js | 7 |
4 files changed, 52 insertions, 6 deletions
diff --git a/demos/accordion/noAutoHeight.html b/demos/accordion/noAutoHeight.html index 8f976e347..b20ee6e80 100644 --- a/demos/accordion/noAutoHeight.html +++ b/demos/accordion/noAutoHeight.html @@ -31,9 +31,6 @@ <h3><a href="#">Section 3</a></h3>
<div>
<p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
<ul>
<li>List item</li>
<li>List item</li>
diff --git a/tests/visual/accordion/ul.html b/tests/visual/accordion/ul.html new file mode 100644 index 000000000..9ba47824f --- /dev/null +++ b/tests/visual/accordion/ul.html @@ -0,0 +1,45 @@ +<!doctype html>
+<html>
+ <head>
+ <title>Accordion Visual Test : UL</title>
+ <link rel="stylesheet" href="../../static/static.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
+ <script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.accordion.js"></script>
+ <script type="text/javascript">
+ $(function(){
+ $("#accordion").accordion()
+ });
+ </script>
+ </head>
+ <body>
+ <ul id="accordion">
+ <li>
+ <h2>
+ <a href="#">Accordion Header 1</a>
+ </h2>
+ <div>
+ Accordion Content 1
+ <ul>
+ <li>Some list item</li>
+ <li>Some list item</li>
+ </ul>
+ </div>
+ </li>
+ <li>
+ <h2>
+ <a href="#">Accordion Header 2</a>
+ </h2>
+ <div>Accordion Content 2</div>
+ </li>
+ <li>
+ <h2>
+ <a href="#">Accordion Header 3</a>
+ </h2>
+ <div>Accordion Content 2</div>
+ </li>
+ </ul>
+ </body>
+</html>
diff --git a/themes/base/ui.accordion.css b/themes/base/ui.accordion.css index 305e8a7de..ee1b1b640 100644 --- a/themes/base/ui.accordion.css +++ b/themes/base/ui.accordion.css @@ -1,8 +1,7 @@ /* Accordion ----------------------------------*/ .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } -.ui-accordion li {display: inline;} -.ui-accordion .ui-accordion-content li {display: list-item;} +.ui-accordion .ui-accordion-li-fix { display: inline; } .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em 2.2em; } .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } diff --git a/ui/ui.accordion.js b/ui/ui.accordion.js index da1712dcc..659cd4a5e 100644 --- a/ui/ui.accordion.js +++ b/ui/ui.accordion.js @@ -32,6 +32,11 @@ $.widget("ui.accordion", { } this.element.addClass("ui-accordion ui-widget ui-helper-reset"); + + // in lack of child-selectors in CSS we need to mark top-LIs in a UL-accordion for some IE-fix + if (this.element[0].nodeName == "UL") { + this.element.children("li").addClass("ui-accordion-li-fix"); + } this.headers = this.element.find(o.header).addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-all") .bind("mouseenter.accordion", function(){ $(this).addClass('ui-state-hover'); }) @@ -369,7 +374,7 @@ $.extend($.ui.accordion, { clearStyle: false, event: "click", fillSpace: false, - header: "> li :first,> :not(li):even", + header: "> li > :first-child,> :not(li):even", icons: { header: "ui-icon-triangle-1-e", headerSelected: "ui-icon-triangle-1-s" |