I have a small problem which is dependent on browser. If you open this link, http://mazzeyprod-env-wbyfpn2srt.elasticbeanstalk.com/ in chrome and mozilla firefox you can see that in Mozilla Firefox if click on any buttons on the header the page smoothly transitions but if you do the same in Chrome, it reloads the entire page. But in Mozilla the Header always stays on the page. Can anyone help me how can I fix it ?
Both browsers are loading the pages as you navigate. It happens that ff does not make it apparent when reloading parts whose content remains the same. To notice the reloading you may use firebug or dev tools of ff and change the color of a menu link, once you navigate to another page the menu link will be reloaded and the color will be reverted.
Related
I dont know if this is a bug that was introduced on latest version of chrome because it does not happen on any older version of chrome nor on any version of Firefox. Maybe it's a feature or a bug, but I still need a way to fix it but after trying from 2 hours, no luck.
The problem: I have a page with a button and an iframe inside. When I click the button I change the iframe SRC. It works fine. However, if after clicking the button I click the BACK button of chrome browser, it makes the iframe reload the SRC that was assigned.
When I click the BACK button of chrome, it should not mess with iframe history. This problem just started happening now, only on latest version of chrome.
Any way I can fix this using the history object, I mean, preventing iframe navigation to affect the top window history?
I've made a simple HTML page. When I press the Reload icon in the browser (Safari Mac, Chrome Mac, Safari iOS), the page reloads, and retains the vertical position in the page.
Is this the default behaviour in browsers these days? I seem to remember that browsers used to go to the top of the page before (at least some years back). When did this change?
What is the best way to make the browser go to the top of the page when the page is reloaded? Simply hook into "On Document Load", and jump to an anchor at the top?
Use window.scrollTo(0,0) on document load
EDIT 1:
Something like this should do the trick:
document.onload = function(){
window.scrollTo(0,0);
}
I've implemented history.replaceState() to my site when clicking to load more. Each time you click, the script adds extra elements to the container using an ajax call and then uses replaceState. Everything is working as expected on that front, but when you click to load more a few times, and then click to refresh the page, or cmd+r, the page is refreshed, but then jumps to the bottom of the browser. My thought is that it's because it's trying to keep the same scroll position (maybe because the browser thinks it's on the same page? I dunnno, but since the page was refreshed a lot of the inserted elements are removed, so it just goes to the bottom.
Adding an anchor tag seems to work for firefox on mac, but safari is still jumping to the bottom, as is mobile safari.
I have a script that writes an iFrame which loads a page. I created a JSFiddle to make things clear:
link JSFiddle loading CNN in a frame
This loads CNN in a frame. If you scroll down in the frame to the news and click on the new articles and then 'back' there is some strange behavior in both Safari and Google Chrome: clicking 'back' doesn't take the iframe 'back', it takes the entire parent frame 'back'. How can I prevent this from happening?
Also strange is that fact that this doesn't always happen. Try it out for yourself, click at least 5-10 links and you'll see that the fiddle will reset itself every now and then. And that shouldn't happen...
This is behavior that only seems to happen in Safari en Chrome, Opera and IE don't seem to have this problem...
Browser registers history events when you click different URLS, since iframe is part of the page u are on it will register the click inside the iframe as a history event of the parent page. Different browsers may have slightly diferent behavior - I expect FF and Chrome be one way and IE behave slightly different. However testing your example both Chrome and IE worked exactly the same and pretty much as expected.
So to clarify:
Loading JSFiddle is a historical event as far as browser is concerned.
Clicking the button to create and load an Iframe is NOT a historical event.
Clicking a URL link within the Iframe window is a historical event.
At this point u have 2 states that the browser remembers and you can go back and forth in history between them.
I have weird problem,
i've placed an google ads on my page and it is visible in firefox but it's not visible in IE. I tried in different systems..
I could not find the problem...
Javascript is on and google ads are no blocked and no specific ad blocker are enabled. I'm sure about that but i could not find about this issue..
My link is http://hiox.org
Open the site in IE8
Press F12 for developer tools
Click the mouse icon on the HTML tab
Go back to the browser window and click the DIV above "user comments" where the ads are supposed to render
Go back to the Develop Tools window and look at the list of Styles (on the right) the DIV has inherited
Untick to disable overflow-x: hidden and the ads will appear
Fix that CSS!