Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Rotator > two rotators, one page, eventually out of sync

• Randy Douglas

  Posted on May 18, 2010 (permalink)

  I have two radrotators, a horizontal scroller with 4 images at the bottom, and a single 'main' image radrotator at the top. I have it set up to display the disappearing item in the bottom scroller to the main image section as it moves forward. Is it possible to have the main image radrotator change based on the index of the lower one while still using the 'slide show' or 'automatic advance' rotator type? Or running two rotators off the same timer would help. After a couple minutes they get out of sync. I set both rotators to have the same scrollduration and frameduration. If this is possible, can you please offer a sample. Thanks!

  Reply

• Answer Randy Douglas

  Posted on May 19, 2010 (permalink)

  RotatorType="FromCode"

  OnClientItemShowing="itemShowing_handler"

  function itemShowing_handler(sender, args) {

  if (sender.isScrollingLeft() == true) {

  $find('<%= ActiveSlide.ClientID %>').showNext(Telerik.Web.UI.RotatorScrollDirection.Up);

  }

  else if (sender.isScrollingLeft() == false) {

  $find('<%= ActiveSlide.ClientID %>').showNext(Telerik.Web.UI.RotatorScrollDirection.Down);

  }

  }

  Figured it out. 
  

  This worked for my previous and next buttons also.

   

   

   

  Reply


• Randy Douglas

  Posted on May 20, 2010 (permalink)

  This thread can be marked as answered.

  Reply

• Dan

  Posted on Jan 19, 2012 (permalink)

  Hi Randy,
  
  I am looking to do exactly the same thing that you describe in this thread (i.e. a main image rotator with a multiple image rotator below it that are kept in sync).  I was wondering if you still had this code around and could provide me with a working sample?
  
  Thanks in advance for your help.
  Dan
  

  Reply

• Randy Douglas

  Posted on Jan 20, 2012 (permalink)

  Hi Dan,
  
  Unfortunatly, I do not. I posted this long ago while working for a previous employer. Hopefully what I've already posted will help.

  Reply

• Slav Slav

  Posted on Jan 24, 2012 (permalink)

  Hi Dan,
  
  I have prepared a sample project that demonstrates the desired functionality. Overall, the following approach is used:
  

  • Setup the main image rotator in FromCode mode (RotatorType="FromCode").
  • Attach a handler to the OnClientItemShowing event of the multiple images rotator.
  • Implement the handler as follows :

  function OnClientItemShowing(sender, args) {

      var singleImageRotator = $find("<%= RadRotator1.ClientID %>");

      singleImageRotator.showNext(Telerik.Web.UI.RotatorScrollDirection.Left);

  }

  
  Please use the attached example as a reference for incorporating this feature into your actual project.
  
  Regards,
  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

  Attached files

  • RadRotatorsSynchronization.zip

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Rotator > two rotators, one page, eventually out of sync