r1112 - in trunk: tests ui

r1112 - in trunk: tests ui


Author: joern.zaefferer
Date: Fri Dec 12 05:58:41 2008
New Revision: 1112
Modified:
trunk/tests/accordion.js
trunk/ui/ui.accordion.js
Log:
Accordion: Fixed jumpy behaviour (#3646) by wrapping content elements in an
additional div
Modified: trunk/tests/accordion.js
==============================================================================
--- trunk/tests/accordion.js    (original)
+++ trunk/tests/accordion.js    Fri Dec 12 05:58:41 2008
@@ -10,7 +10,7 @@
function state(accordion) {
    var args = $.makeArray(arguments).slice(1);
    $.each(args, function(i, n) {
-        equals(accordion.find(".ui-accordion-content").eq(i).is(":visible"), n);
+        
equals(accordion.find(".ui-accordion-content").parent().eq(i).is(":visible"),
n);
    });
}
@@ -24,13 +24,13 @@
test("autoheight", function() {
    $('#navigation').accordion({ autoHeight: false });
-    equals( 90, $('#navigation ul:first').height() );
-    equals( 126, $('#navigation ul:eq(1)').height() );
-    equals( 54, $('#navigation ul:last').height() );
+    equals( 90, $('#navigation div:first').height() );
+    equals( 126, $('#navigation div:eq(1)').height() );
+    equals( 54, $('#navigation div:last').height() );
    $('#navigation').accordion("destroy").accordion({ autoHeight: true });
-    equals( 126, $('#navigation ul:first').height() );
-    equals( 126, $('#navigation ul:eq(1)').height() );
-    equals( 126, $('#navigation ul:last').height() );
+    equals( 126, $('#navigation div:first').height() );
+    equals( 126, $('#navigation div:eq(1)').height() );
+    equals( 126, $('#navigation div:last').height() );
});
test("activate, numeric", function() {
@@ -89,7 +89,7 @@
function state2(accordion) {
    var args = $.makeArray(arguments).slice(1);
    $.each(args, function(i, n) {
-        equals(accordion.find("ul").eq(i).is(":visible"), n);
+        equals(accordion.find("div").eq(i).is(":visible"), n);
    });
}
Modified: trunk/ui/ui.accordion.js
==============================================================================
--- trunk/ui/ui.accordion.js    (original)
+++ trunk/ui/ui.accordion.js    Fri Dec 12 05:58:41 2008
@@ -32,7 +32,8 @@
        this.element.addClass("ui-accordion ui-widget ui-helper-reset");
        var groups = this.element.children().addClass("ui-accordion-group");
        var headers = options.headers =
groups.find("> :first-child").addClass("ui-accordion-header ui-helper-reset
ui-state-default ui-corner-all");
-        headers.next().addClass("ui-accordion-content ui-helper-reset
ui-widget-content ui-corner-bottom");
+        // wrap content elements in div against animation issues
+        headers.next().wrap("<div/>").addClass("ui-accordion-content
ui-helper-reset ui-widget-content ui-corner-bottom");
        
        var active = options.active = findActive(headers,
options.active).toggleClass("ui-state-default").toggleClass("ui-state-active").toggleClass("ui-corner-all").toggleClass("ui-corner-top");
        active.parent().addClass("selected");
@@ -102,9 +103,10 @@
        var headers = this.options.headers.removeClass("ui-accordion-header
ui-helper-reset ui-state-default ui-corner-all ui-state-active
ui-corner-top")
            .removeAttr("role").removeAttr("aria-expanded").removeAttr("tabindex");
        headers.find("a").removeAttr("tabindex");
-        headers.next().removeClass("ui-accordion-content ui-helper-reset
ui-widget-content ui-corner-bottom")
-            .removeAttr("role").css({display: "", height: "", overflow: "",
marginTop:"", marginBottom:""});
        headers.children(".ui-icon").remove();
+        headers.next().children().removeClass("ui-accordion-content
ui-helper-reset ui-widget-content ui-corner-bottom").each(function(){
+            $(this).parent().replaceWith(this);
+        })
    },
    _keydown: function(event) {
@@ -355,11 +357,8 @@
            var hideHeight = options.toHide.height(),
                showHeight = options.toShow.height(),
                difference = showHeight / hideHeight,
-                padding = options.toShow.outerHeight() - options.toShow.height(),
-                margin = options.toShow.css('marginBottom'),
-                overflow = options.toShow.css('overflow')
-                tmargin = options.toShow.css('marginTop');
-            options.toShow.css({ height: 0, overflow: 'hidden', marginTop: 0,
marginBottom: -padding }).show();
+                overflow = options.toShow.css('overflow');
+            options.toShow.css({ height: 0, overflow: 'hidden' }).show();
            
options.toHide.filter(":hidden").each(options.complete).end().filter(":visible").animate({height:"hide"},{
                step: function(now) {
                    var current = (hideHeight - now) * difference;
@@ -374,7 +373,7 @@
                    if ( !options.autoHeight ) {
                        options.toShow.css("height", "auto");
                    }
-                    options.toShow.css({marginTop: tmargin, marginBottom: margin,
overflow: overflow});
+                    options.toShow.css({overflow: overflow});
                    options.complete();
                }
            });