3

If I go to stackexchange.com and click all sites and list as names https://stackexchange.com/sites?view=list#name and then use my chrome browser to search for instances of "teach" I get 19 results.

However when I use the little down-arrow in my browser search, it takes me through the list on a bumpy ride, jumping (seemingly) randomly up and down the long page.

As far as I can tell there are only 19 instances and probably it's catching them all, just not in the sequence in which they appear in this sorting.

I've never seen this behavior before. Is it just me and my laptop or do other people see this as well? I don't think this is a bug, or a feature, perhaps just a curiosity?

2

It happens for any search with many results on almost all of the sort orders on the page. You only lose the "bumpy ride" when you sort the page by site age (which is also site number).

I don't know exactly how that page is created but my guess is that the sorting is done in a way that doesn't change the reference order of the content on the page, only its appearance. So, when you search for the content, it finds it in the default site number list and then jumps to wherever that happens to be rendered on the page.

If you view the page source starting around line 333, you can see that the order of the sites is in the order of the Site IDs, starting with Stack Overflow and Server Fault and Super User... so this aligns with the guess I have. Again, I'm not sure how we render it but the source, which is what your browser is searching, is in a different order than what you're viewing, hence, the jumping.

  • so it's more of aesthetic issue than a functional one, I still get all results. – uhoh Mar 7 at 7:15
  • Yeah. If you want to avoid the jumping around, you can pick a different sort order (the default one)... not the best solution but it's all I've got. – Catija Mar 7 at 7:17
  • 2
    The "sorting" is indeed done by changing the inline style for the <div> that contains a site. The inline style/css used is: style="position: absolute; left: 0px; top: 0px;" for the div that should appear first, style="position: absolute; left: 0px; top: 107px;" for the second, `style="position: absolute; left: 0px; top: 217px;" for the third, etc. This helps client-side performance as you don't have to move the Nodes around. Your analysis is sound. The browser "finds" items based on their order in the DOM (and that order is stable on that page), not how they appear on the screen. – rene Mar 7 at 11:53

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .