Opened 9 years ago

Closed 9 years ago

Last modified 8 years ago

#11043 closed defect (fixed)

[patch][ccla]Slider bugs in RTL mode

Reported by: bill Owned by: Douglas Hays
Priority: high Milestone: 1.5
Component: Dijit - Form Version: 1.4.0
Keywords: Cc: Adam Peller
Blocked By: Blocking:

Description (last modified by Douglas Hays)

Slider has issues in IE8+RTL mode including cut-off labels and misplaced handle, see the attached screenshot for details. IE6 and 7 render fine.

Attachments (5)

Slider.JPG (111.9 KB) - added by bill 9 years ago.
screenshot w/problems in red squares
11043.patch (2.8 KB) - added by Douglas Hays 9 years ago.
possible fix changing image handle to position:relative so that % can be used
ieQuirks.png (5.3 KB) - added by bill 9 years ago.
label position problem, IE quirks vertical slider
11043.2.patch (3.0 KB) - added by Douglas Hays 9 years ago.
add position:relative to decoration TD tags
ie6.png (5.7 KB) - added by bill 9 years ago.
IE6 slider warped around 0 and 100

Download all attachments as: .zip

Change History (20)

Changed 9 years ago by bill

Attachment: Slider.JPG added

screenshot w/problems in red squares

comment:1 Changed 9 years ago by bill

Version: 1.5.0b11.4.0

Forgot to mention, this isn't a new bug. However, it does make slider near-unusable in RTL mode, since the labels aren't visible.

comment:2 Changed 9 years ago by Adam Peller

in FF, the thumb is invisible in RTL mode

comment:3 Changed 9 years ago by Douglas Hays

Description: modified (diff)

comment:4 Changed 9 years ago by Douglas Hays

Cc: Adam Peller added

peller, in what version of FF and what OS are you not seeing the thumb image? I see it in FF3.5 and FF3.6 on WinXP. I tested against: http://download.dojotoolkit.org/release-1.5.0b2/dojo-release-1.5.0b2/dijit/tests/form/test_Slider.html?theme=tundra&dir=rtl

Changed 9 years ago by Douglas Hays

Attachment: 11043.patch added

possible fix changing image handle to position:relative so that % can be used

comment:5 Changed 9 years ago by Douglas Hays

Milestone: tbd1.5
Status: newassigned
Summary: Slider bugs in RTL mode[patch][ccla]Slider bugs in RTL mode

bill, please review the attached patch

comment:6 Changed 9 years ago by bill

It looks good in IE8 and the CSS is in an improvement (because it doesn't hardcode things -like -6px), but on IE8/IE7 compat mode (for test_Slidr?dir=rtl) I don't see the slider handle at all. On the bright side, the labels seem to be fixed on IE8 and IE8/IE7 compat mode.

comment:7 Changed 9 years ago by Douglas Hays

Resolution: fixed
Status: assignedclosed

(In [22108]) Fixes #11043. Changed image handle from position:absolute to relative so that left/right % values can be used instead of handcoded px values. Changed rule-labels to be a block div instead of inline span so that the labels are fully rendered in IE.

Changed 9 years ago by bill

Attachment: ieQuirks.png added

label position problem, IE quirks vertical slider

comment:8 Changed 9 years ago by bill

Resolution: fixed
Status: closedreopened

Cool, looking a lot better. I see one remaining problem on IE quirks RTL mode (all versions of IE), hopefully you can fix that one too. Here's a screenshot from themeTesterQuirk.html?theme=claro&dir=rtl:

label position problem, IE quirks vertical slider

Changed 9 years ago by Douglas Hays

Attachment: 11043.2.patch added

add position:relative to decoration TD tags

comment:9 Changed 9 years ago by Douglas Hays

bill, please review the last patch that fixes the IE+quirks+RTL+vertical rendering bug. This was more IE absolute positioning nonsense. I added position:relative to the TD decoration containers similar to how Spinner fixed the arrows rendering problem initially.

comment:10 in reply to:  4 Changed 9 years ago by bill

Replying to doughays:

peller, in what version of FF and what OS are you not seeing the thumb image? I see it in FF3.5 and FF3.6 on WinXP. I tested against: http://download.dojotoolkit.org/release-1.5.0b2/dojo-release-1.5.0b2/dijit/tests/form/test_Slider.html?theme=tundra&dir=rtl

He was problem running from a case sensitive file system or a case sensitive web server, there was a case problem that Cougar just fixed in [22119].

Changed 9 years ago by bill

Attachment: ie6.png added

IE6 slider warped around 0 and 100

comment:11 in reply to:  9 Changed 9 years ago by bill

Replying to doughays:

bill, please review the last patch that fixes the IE+quirks+RTL+vertical rendering bug. This was more IE absolute positioning nonsense. I added position:relative to the TD decoration containers similar to how Spinner fixed the arrows rendering problem initially.

Great, looking a lot better. The only thing I noticed is that IE6 looks "warped" when numbers are on both sides. Not sure if that's fixable or not:

IE6 slider warped around 0 and 100

comment:12 Changed 9 years ago by Douglas Hays

Resolution: fixed
Status: reopenedclosed

(In [22121]) Fixes #11043. Add position:relative to TD tags within Slider to keep IE fromm misrendering absolute positioned elements.

comment:13 Changed 9 years ago by Douglas Hays

(In [22122]) References #11043. position:relative should only be applied to vertical sliders.

comment:14 Changed 9 years ago by Douglas Hays

(In [23099]) Fixes #11917. Refs #11043. Constrain vertical slider position:relative on TD to just the middle row and fixup robot tests.

comment:15 Changed 8 years ago by bill

Component: DijitDijit - Form
Note: See TracTickets for help on using tickets.