0
Completed

Widget Scroll Up After Pagination

galambalazs 3 years ago in Widgets • updated 3 years ago 5
When you change to a page with only a few rows the widget doesn't scroll up automatically.
(like it does when a regular dashboard is shown on userecho.com)

I understand that the iFrame cannot directly change the top page's scroll position, but it could send a window.postMessage so that the top page can respond.

Is there an API for this?

Answer

Answer
Completed
Hello,
We do not implement scrolling to this part because we do not think that we actually need it right now.
But we found the problem why the frame doesn't going to be lower if it has smaller content inside. So, we've fixed it.
Now it looks better. Check your page.
If you still will have some problem with it we will add auto scrolling too.
GOOD, I'M SATISFIED
Satisfaction mark by galambalazs 3 years ago
Under review
Hello,
Could you provide us a webpage with this widget? we will check it and fix if needed.
Hi! You can see this happening on this page: http://www.homenewtab.com/farewell.html

The 1st page has 10 threads, the 2nd has less (1 in this case).

When you click the number [2] at the bottom the page doesn't scroll up (and the height stays the same) leaving a blank emptiness for the viewer. They might not even notice that changing the page was successful.


Here is a possible fix:


Every time the height of the widget changes you send a message to the Top frame
(this snippet goes inside your Widget iFrame):

function sendDocumentHeightToParent() {
  var message = {
    name  : 'UserEcho.DocumentHeight', 
    value : document.body.scrollHeight
  };
  window.parent.postMessage(message, "*");
}

// call this when the height of the widget changes (e.g. onload, pagination, etc)
sendDocumentHeightToParent();


Then the top frame can intercept and respond to such messages by adjusting the iframe's height
(this snippet belongs to your widget's top level <script> code)

var addListener  = window.addEventListener || window.attachEvent;
var messageEvent = window.addEventListener ? 'message' : 'onmessage';
addListener(messageEvent, function (e) {
  if (e.data && e.data.name == 'UserEcho.DocumentHeight') {
    var iframe = document.getElementById('<GET IFRAME IN ue-embedded-widget>');
    iframe.height = e.data.value;
    window.scrollTo(0, 0); // ... or scroll to the top of the Widget specifically
  }
});
Answer
Completed
Hello,
We do not implement scrolling to this part because we do not think that we actually need it right now.
But we found the problem why the frame doesn't going to be lower if it has smaller content inside. So, we've fixed it.
Now it looks better. Check your page.
If you still will have some problem with it we will add auto scrolling too.
yes it's better now, thanks