4 Replies Latest reply on Jul 12, 2016 5:02 AM by noelwhite

    load more + resize me function

    adamjukes

      We have been trying to implement a load more bar in a html widget, however as we are using the resizeme function when we load more the screen takes us back to the top first, can we stop it from going back to the top and just show the load more?

        • Re: load more + resize me function
          bharatpec

          Manipulate the resizeMe() function:

          assign to another variable oldResizeMe = resizeMe

           

          in the new resizeMe() function, follow these steps:
          1. calculate the scrollTop
          2. call oldResizeMe()

          3. use scrollTo(x,y) to scroll back to that particular position.

           

          Bharat.

            • Re: load more + resize me function
              adamjukes

              And what if we wanted to avoid scrolling back to the top to then scroll back down again, not a great user experience? Anyway to remain just at the bottom without scrolling back up then down again?

               

              Many thanks

              Adam

                • Re: load more + resize me function
                  bharatpec

                  Hey,

                   

                  We had implemented this a few months back. I remember that the user experience was smooth and it was not flashy. Just try this approach for yourself.  For stopping the scroll to go to the top at the first place, I'll try finding a solution and then let you know.

                   

                  Bharat.

                • Re: load more + resize me function
                  noelwhite

                  In my widgets, I did the same thing Bharat Sethi described.  There is one complexity that you need to account for.  The widget will be using JavaScript, so Jive will put it into an iframe.  This means you have to get the scrollTop of the parent, resize the widget, then set the parent to the previous scrollTop.  Here is an example of that...

                   

                   

                  // set variable to the parent form (for complex widgets within multiple frames, this should be done via a process which recurses to the correct parent)
                  var parentWindow = window.parent.document;


                  // Get the current position on the top level document, resize the widget, then reposition the parent back to the original location
                  function resizeMeSameLocation() {
                  var scrolltop = $j(parentWindow).scrollTop();
                  resizeMe();
                  $j(parentWindow).scrollTop(scrolltop);
                  }

                  ...
                    // resize the widget but stay at the same location
                    resizeMeSameLocation();
                  ...