#8481 closed defect (duplicate)
IE7 failure using Slider with style "position: fixed"
Reported by: | Adam Peller | Owned by: | Douglas Hays |
---|---|---|---|
Priority: | high | Milestone: | 1.3 |
Component: | Dijit - Form | Version: | 1.2.3 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
The following was posted as a trac report instead of a ticket. Author unknown
Clicking and sliding the slider thumb in the example below works fine in FF3 but causes a JScript error in IE7: "'_offsetParent.tagName' is null or not an object".
The problem does not occur if you remove the "position: fixed" style from widget.
It's no help to enclose the widget in a div having position:fixed.
Test case and patch below.
Test case: to repro, open this html in IE7 and click on the slider thumb.
<!DOCTYPE HTML> <html> <head> <title>Slider position:fixed issue</title> <!-- <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.2.0/dojo/dojo.xd.js" djConfig = 'parseOnLoad: true, isDebug: false'></script> --> <script type="text/javascript" src="./js/dojo-src/dojo/dojo.js" djConfig = 'parseOnLoad: true, isDebug: false'></script> <script type="text/javascript" src="./js/dojo-src/dijit/dijit.js"></script> <style type="text/css"> @import "http://o.aolcdn.com/dojo/1.2.0/dojo/resources/dojo.css"; @import "http://o.aolcdn.com/dojo/1.2.0/dijit/themes/tundra/tundra.css"; html, body { height: 100%; width: 100%; padding: 0; border: 0; } </style> <script type="text/javascript"> dojo.require("dijit.form.Slider"); dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dojo.parser"); function onSliderChange(val){ console.log ('slider val', val); } dojo.addOnLoad( function () { for (var i=0;i< 200; i++){ var div = document.createElement("div"); div.innerHTML = "line " + (i+1); dojo.byId("spacer").appendChild(div) } }); </script> </head> <body> <div dojoType="dijit.layout.BorderContainer" style="height: 2000px"> <div dojoType="dijit.layout.ContentPane" region="center" id="spacer" style="top: 20px;"> <div dojoType="dijit.form.VerticalSlider" onChange="onSliderChange(arguments[0]);" value="50" maximum="100" minimum="0" discreteValues="11" style="height:176px; clear:both; position: fixed; " id="slider2"> <ol dojoType="dijit.form.VerticalRuleLabels" container="leftDecoration" style="width:2em;" labelStyle="right:0px;"> <li>0 <li>100 </ol> <div dojoType="dijit.form.VerticalRule" container="leftDecoration" count=11 style="width:5px;"></div> <div dojoType="dijit.form.VerticalRule" container="rightDecoration" count=11 style="width:5px;"></div> <ol dojoType="dijit.form.VerticalRuleLabels" container="rightDecoration"style="width:2em;" maximum="100" count="6" numericMargin="1" constraints="{pattern:'#'}"></ol> </div> <!-- VerticalSlider --> </div> </div> </body> </html>
Patch to dijit/_base/scroll.js
--- scroll-ORIG.js 2008-11-02 17:52:34.000000000 -0600 +++ scroll.js 2008-11-02 21:59:41.000000000 -0600 @@ -29,10 +29,24 @@ var parent = element.parentNode; var offsetParent = element.offsetParent; if(offsetParent == null){ // process only 1 of BODY/HTML - element = scrollRoot; - offsetParent = html; - parent = null; - } + // in IE7+ set the offsetParent just as FF3 does + // IE7 returns null for the offsetParent if the element has "position: fixed". + // FF3 returns the parent in both cases + // see https://developer.mozilla.org/en/OffsetParent + // n.b. "If the element is non-positioned, the root element + // (html in standards compliant mode; body in quirks rendering mode) is the offsetParent + // We haven't ensured that here, but the "if" statement below filters out that case. + // also see http://www.w3.org/TR/CSS2/visuren.html#position-props + // "An element is said to be positioned if its 'position' property has a value other than 'static'." + if(dojo.isIE >= 7 && element.style && element.style.display != 'none' && element.style.position != 'static'){ + offsetParent = parent; + } els
Change History (2)
comment:1 Changed 12 years ago by
Milestone: | tbd → 1.3 |
---|---|
Resolution: | → duplicate |
Status: | new → closed |
comment:2 Changed 10 years ago by
Component: | Dijit → Dijit - Form |
---|
Note: See
TracTickets for help on using
tickets.
Dup of #8011. Fixed in [15599] in 1.3.