ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Flexform
• August 29, 2013 at 7:35 pm #18911
  Hamilton

  Member

  Post count: 28

  Hello Support,
  I would like to know if there is a way to direct where the page scrolls to when accordions are opened. Ideally it would be great if the page scrolled to have the newly opened accordion at the top of the browser. If this seems unclear then have a look at my page that seems to be a bit user unfriendly because of this issue.

  http://www.playlandcom.com/projects

  If you shrink the width of your browser so that the responsiveness of the site kicks in it makes what I’m talking about much more apparent.

  Click open CONDOMINIUM DEVELOPMENTS, then scroll down as though you viewd all items in the table and then click open RESORT DEVELOPMENTS

  You’ll notice that the resort content opens up much higher up the page and the user is then forced to scroll back up to see the image and beginning of that accordions content.

  Hope this is clear and that there could be a way to make the page scroll up to match the top of the open accordion.

  Thanks,
  /Ryan

  August 30, 2013 at 12:52 pm #19143
  Cosmin – SUPPORT

  Member

  Post count: 3851

  Hi Ryan,

  Well, responsive design is not really meant for desktops, resizing the browser window and such. Instead, this is meant for mobile devices where, obviously, window resizing won’t happen.

  Same with accordions, they don’t include such functionality because it’s not a real life scenario.

  You could add custom jQuery to do something when clicking an accordion header,

  $(".ui-accordion-header").on("click", function(){
    var accOffset = $(this).offset().top;
  
  $('html, body').animate({
      scrollTop: accOffset-10
  	}, 500);
  
  });

  Now this is just off the top of my head, not tested – but this would be the idea. You could add something like that in a RAW JS element on that page.

  Regards,
  ————————————————————————————————————

  Cosmin – Support

  August 30, 2013 at 5:08 pm #19190
  Hamilton

  Member

  Post count: 28

  Hey Cosmin,
  Thanks for getting back,
  I just used the resize of a desktop browser as an example to show you what I meant figuring you would be viewing this on a desktop or laptop.

  The problem I speak of is actually even more pronounced when viewing on a mobile device.
  When an accordion is opened and then an other one gets opened below that one (rather than scrolling up to close the current one) it leaves the view way down at the bottom of the page and in this case on my phone it has them looking at content in the footer rather than bringing them up to the newly opened accordion heading.

  Same fix as what you suggested above?
  Cheers.

  September 2, 2013 at 7:39 pm #19493
  Melanie – SUPPORT

  Member

  Post count: 11032

  Hi Hamilton, please do try Cosmin’s suggestion and let us know how far that takes you!

• Back to forum

  Posted in: Flexform