On Thu, Feb 26, 2009 at 5:28 PM, Max <[email protected]> wrote: > > I have a number of two-handled range sliders on a page. The left > handle is fine; when I slide it all the way to the left it sits at the > leftmost edge of the slider. The right handle, however, ends up with > the left edge of the handle lined up with the right edge of the > slider, which is less than ideal because, the way I have the handles > styled, it looks like the handle is detached from the slider, with a > slight gap. > > Is there any way to tell the plugin to align the middle of the handle > with the edge of the slider's surface
Give both handles a negative left margin equal to 1/2 of the handle's width. This is what the jQuery UI Theme does: http://jquery-ui.googlecode.com/svn/tags/1.6rc6/themes/base/ui.slider.css " .ui-slider .ui-slider-handle { ... width: 1.2em; ... } ... .ui-slider-horizontal .ui-slider-handle { ... margin-left: -.6em; } " > or perhaps make it so that the > slider's bounding box always contains both slider handles at least? When we redesigned the slider in the later 1.6 release candidates (rc3-rc6) as part of our adoption of the new jQuery UI CSS Framework, we had to make a choice between having the handle(s) fit within the slider, or on the slider. We chose the latter. There's been some discussion as to how feasible it might be to also support the former, even with only one as the base design. The closest we have to that at this point is the following demo that Scott Jehl put together: http://jqueryui.com/demos/slider/#side-scroll Notice the slider handle fits always in the slider. This is done manually by adjusting that margin continually based on the value as it slides. - Richard --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
