Using a larger custom image for the drag handles

2 posts, 0 answers
    KP IMG BPO avatar
    2 posts
    Member since:
    May 2010

    Posted 02 Aug 2010 Link to this post

    I'm currently using a slider with two drag handles to set a date range on a web page which is intended to be used with a large touchscreen display.  The problem is that the default drag handles are a little too small to easily grab with a fingertip, so I'd like to use a custom set of larger ones.

    I'm able to do custom skins just fine, right up until the point where I enlarge the drag handles, and then everything goes wrong.  My enlarged handle image experiences all kinds of strange behavior.  It will be truncated (I'll lose the right side of the image) when it first displays.  When I try hovering or dragging, it will suddenly grow to the full size, then sometimes shrink back when I let it go.  The left and right handles will display differently, then when I cross them they'll revert, and so forth.  Basically, it's all gone wacky on me.

    The closest I've been able to get is with this entry in my custom css file:
    .RadSlider_Custom .rslHorizontal a.rslDraghandle,
    .RadSlider_Custom .rslHorizontal a.rslDraghandle:hover,
    .RadSlider_Custom .rslHorizontal a.rslDraghandle:focus,
    .RadSlider_Custom .rslHorizontal a.rslDraghandle:active

    Am I close? :)

    If you can attach a sample project with 2 custom drag handles that are simply 30x20 pixel black rectangles, that should get me to the finish line.

    Thank you
    KP IMG BPO avatar
    2 posts
    Member since:
    May 2010

    Posted 04 Aug 2010 Link to this post

    Nevermind.  Realized I just had to specify height and width in the css with "important!" after them.
  3. DevCraft R3 2016 release webinar banner
Back to Top