scrolling RadMenu farther

1 posts, 0 answers
  1. Arkadiusz
    Arkadiusz avatar
    9 posts
    Member since:
    Jan 2017

    Posted 06 Jun 2017 Link to this post

    Hello!
    I have horisontal scrolling bar, in aspx file it looks like:

    <telerik:RadMenu ID="ActionListMenu" SkinID="Menu" OnItemDataBound="OnActionButtonDataBound" 
                            Width="100%" Flow="Horizontal" runat="server" DefaultGroupSettings-Flow="Horizontal" DefaultGroupSettings-RepeatColumns="1" CssClass="ActionsBar">
                        </telerik:RadMenu>

     

    and in website it's:

    <div class="rmScrollWrap rmRootGroup rmHorizontal" style="overflow-x: hidden; overflow-y: hidden; width: 100%; overflow: visible;">
        <ul class="rmRootScrollGroup" style="position: relative; width: 519px; display: block; left: -35px;">
             <li class="rmItem " ... />
             ...
             <li class="rmItem " ... />
        </ul>
        <a class="rmLeftArrow" style="z-index: 2000; top: 0px; left: -1px;" href="#" jQuery191013909904974899967="13">
        <a class="rmRightArrow" style="z-index: 2000; top: 0px; right: -1px;" href="#" jQuery191013909904974899967="11">
    </div>

    Now I'm trying to make it scroll farther (more than one "rmItem").
    To do so I tried to add events to "rmLeftArrow" and "rmRightArrow" that would change "rmRootScrollGroup" "left" css property, but after all it comming back to the place it shuld be without my stript.
    I think that after clicking on arrow Telerik's script sets expected value of "rmRootScrollGroup" "left" css property to some variable, and after moving it by any way (mouse scrolling, clicking/mouseovering arrows) it will start from the point it shuld be.

    Example:
    After clicking on the right arrow, position of rmRootScrollGroup shuld change from 0px to -25px.
    I add another -200px (by attatching click event on arrow, something like .style.left = (.style.left - 200) + 'px' ))
    so now rmRootScrollGroup has property left: -225px. And it really appears on -225px.
    The problem is, that after mouseovering on arrow it will return to -25px :(

    Is there any way to make it moving further?

Back to Top