Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Rotator > Radrotator with pagination

Not answered Radrotator with pagination

Feed from this thread
  • suresh avatar

    Posted on Sep 15, 2011 (permalink)

    Hi there,
    I want to use radrotator with pagination which means I have to rotate three images automatically, on every image rotation the pagination with numbers 1,2,3 have to selected for respective images....which  it is possible in radrotator?.

    Thanks in advance,
    Regards,
    suresh.

    Reply

  • Slav Slav admin's avatar

    Posted on Sep 20, 2011 (permalink)

    Hi Suresh,

    Such functionality can be incorporated into the RadRotator with some client-side scripts. Every number of the pagination will call a JavaScript method that will display the selected item by setting the current index. This can be achieved with the client method set_currentItemIndex. In order to display the selected item for the same duration as every one of the rest, you can use the stop and start methods before and after the current index is set, which will restart the sliding animation. The marking of the currently displayed item on the pagination can be achieved by setting the CSS through JavaScript.

    In addition to this, the client-side event OnClientItemShown can be used to mark the current item on the pagination, as it is fired every time a new item is displayed.

    The solution, suggested above, is implemented in the attached example. Please use it as a reference to incorporate the functionality into your actual project.

    Greetings,
    Slav
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now

    Reply

  • suresh avatar

    Posted on Sep 27, 2011 (permalink)

    Hi slav,
       Thanks for your valuable response..The example you provide for me  is working great..In your example you put the pagination under the rotator.Is it possible to put a pagination inside the radrotator..What I need is pagination  overlaps the images  and every images rotate behind the pagination,but pagination should be static position,,

    Thanks in advance,
    Regards,
    S.Suresh

    Reply

  • Slav Slav admin's avatar

    Posted on Sep 29, 2011 (permalink)

    Hi Suresh,

    You can utilize CSS in order to position the HTML div element with the pages absolutely and to configure its placement via the rules left and right. The CSS class that you should apply to the pages will look like the example below:
    <style type="text/css">
        .pagination
        {
            position: absolute;
            left: 129px;
            top: 178px;
        }
    </style>

    <div id="buttons" class="pagination">
        <a href="javascript: selectItem(0)">1</a> <a href="javascript: selectItem(1)">2</a>
        <a href="javascript: selectItem(2)">3</a> <a href="javascript: selectItem(3)">4</a>
        <a href="javascript: selectItem(4)">5</a> <a href="javascript: selectItem(4)">6</a>
    </div>

    Please note that the distance to the left and to the top is specific to the sample project, attached in my previous post. To incorporate the solution into your actual project, you will have to set the values according to the layout of your page.

    There is yet another implementation of the desired scenario that I can suggest. It is presented by the online demo Rotator / Pager Integration. You can refer to it as well, in order to achieve the paging functionality.

    All the best,
    Slav
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now

    Reply

  • suresh avatar

    Posted on Oct 6, 2011 (permalink)

    Thanks slav, Its working nice.

    Reply

  • veera avatar

    Posted on Oct 31, 2011 (permalink)

    Can you provide the compete visual studio code for this. I am having trouble in getting this code working.

    Thanks,
    Veera.

    Reply

  • Slav Slav admin's avatar

    Posted on Nov 3, 2011 (permalink)

    Hi Veera,

    For your convenience I have prepared a sample page, containing the full solution with the fixes. Please use it as a reference for incorporating this feature into your actual project.

    Best wishes,
    Slav
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now

    Reply

Back to Top

Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Rotator > Radrotator with pagination
Related resources for "Radrotator with pagination"

[  ASP.NET Rotator Features  |  Documentation  |  Demos |  Telerik TV  |  Self-Paced Trainer  |  Step-by-step Tutorial  ]