pnguyen1097
commented
12 years ago I used line 54 to change the hashtag on the address bar to the href value of the tab that was clicked on. That way the address bar will reflect the content of the page, which I think Zach said there is a principle about that . On document load, the script will read the hashtag and trigger the click event for the appropriate tab, making the tabs linkable and bookmarkable.
But whenever the hashtag is changed, the browser will scroll to the location of the div with the same id, which is really annoying, because the page jumps unexpectedly every time you click a tab. To fix that, I record the current scroll position, then change the hashtag, and then scroll back to the same position.
Chrome seems to have problem with the scrolling part. If I delayed the scroll, the it works just fine, but scrolling immediately seems to cause Chrome not to render the entire page (on my computer, it seems to only render half a page).
I think I found a solution in commit 6e63948990. Basically the browser scrolls because there is an element on the page with the same id as the hashtag. So instead of changing the hash tag to the href of the tab, I change it to #tab=href. So now the browser will not scroll anymore, because there isn't any id like that. On document load, the script will simply strip off the 'tab=' when triggering click event.
I'm not closing this issue yet because I think we still need to test it more first.
Okay, so on honors-academics.html in Chrome only (not apparent in Firefox, Safari...IE unknown) when I am scrolled to the header (as far up as I go) and I try to switch the tabs they do not work. The content of the selected tab loads on top on the old tab's contents and the tab css do not change.
However, if I scroll down and then back up the tabs css fixes itself. Likewise, if I perform the same procedure scrolled slightly down and selecting tabs, the content will no longer overlap, but the tabs css remain messed up.
Mark's solution to this was commenting out line 53 and 55 from tabs.js - I do not follow the details as for why this works.
Also - I've tried this with other honor's pages and the same problem happens. The current versions of all pages are already uploaded to git - though the two lines from tabs.js are not removed (so you can see the problem)