OK here is my issue - ever so often 10 or 20 loads of the page, from various menu options Google Chrome stutters on the Bootstrap Navbar. What happens is that the navbar drops into the live page and it appears that Chrome threw a break into the Bootstrap Navbar. At first i thought it might be the iframe that i have in script, but even after removing that it still shows up. Again this is VERY intermittent, but enough to bug some Chrome users. I have scoured the dev tools to find out what is causing it to no avail.
you can view the code at www.murphyschphouse.com/contactus.html and also the resform.html - although not as much on that page (maybe ever 50 loads or so) - and they are pretty much identical in code. I.E. handles it just fine - usually it is the other way around - go figure ... Any help to solve this would be greatly appreciated. I have written a JavaScript script that reloads the page and this seems to solve it, but I think I would rather have a CSS fix rather than a JavaScript hack. HELP
Related
I have a website that recently started to have an issue with a bunch of divs containing links and images are flashing at the top of the website momentarily while the page loads.
See: pelicancases.com
It's strange because I see those images already rendered even before the images flash. Also, this is a new occurrence.
Could this possibly be due to CSS animation or CloudFlare caching/optimization?
Any recommendations on how to fix this issue would be greatly appreciated.
If I use WebPageTest to inspect your page I see some browser related issues.
When testing with Chrome there are three 404s
https://www.webpagetest.org/result/160921_2N_1GQS/
http://www.pelicancases.com/android-chrome-192x192.png
http://www.pelicancases.com/favicon-96x96.png
http://www.pelicancases.com/favicon-194x194.png
If I test with IE 11 I don't see any 404s
https://www.webpagetest.org/result/160921_TE_1H77/
To troubleshoot I would start by disabling CloudFlare caching
(Domain > Overview > Development Mode > Enabled)
Then fix the 404s, they may not be the cause of the problem but worth eliminating first.
If you still have the flashing, try and figure out if it's browser related.
Good luck!
I'm having an issue with my website http://www.ben-drury.co.uk/ (I know the content sounds dumb, but it's my first attempt at a portfolio and it's not finished) where the formatting of the text is very peculiar under a specific set of circumstances.
When loading any post or page in Google Chrome, if I remain in the tab for the duration of the loading it looks like the image below, which is perfect and exactly what I want.
However if I start loading the webpage in a new tab and don't instantly navigate to that new tab, or indeed if I refresh the page and navigate away from the tab, when I come back it looks like the image below.
Interestingly it seems to work absolutely fine in Internet Explorer and Firefox, so initially I thought that it might be an issue with my installation of Google Chrome. However testing it on other computers resulted in the same thing happening, and a variety of different ways of phrasing the issue has turned up very little.
So essentially, how do I fix it for Google Chrome users?
(For those that cannot see the images, the text in the post placed as an example runs outside of the box it should be displayed in and often lines appear over the top of each other around hyper links.)
Update:
I've managed to fix the issue for pages by removing the justified alignment of the text. However I have made said change to the posts as well yet the problem persists for them.
So after a little more delving into the issue, I came to the conclusion that not only was the idea of web safe fonts actually a load of miss-represented nonsense, but that Google fonts might be the way to go. After installing a plugin for Google fonts onto WordPress and making all my posts use one by default, my problem has been entirely resolved and I can even have justified text on my posts and pages.
I've recently completed my first custom-built Wordpress website, based on Automattic's Toolbox theme, and am in the process of testing it. I'm having some strange issues with IE 6-8 which I've not experienced before - the entire navigation bar, including the background colour, disappears leaving only the logo. None of the navigation links show up, nor does the button which triggers the menu dropdown on small screen sizes.
The website is http://fpsl.eu , and I'm pretty much stumped. I don't think it's a JS issue since it works fine in Firefox and Chrome without JS. An HTML5 shiv comes preinstalled with Toolbox so I don't think it's a compatibility issue in that respect...but maybe I'm wrong, and I don't know how to check!
(I'm using Browserstack to test and am actually wondering if its rendering is accurate - my portfolio website which I tested extensively a few months ago - www.dearjackalope.com - is now causing Browserstack's IE virtual machine to hang, despite my having made no major changes other than adding content - this is a separate issue I guess, but it makes me unsure as to whether all my sites are breaking at once or if it's just Browserstack being moody!)
I am checking your site(http://fpsl.eu/) in ie7,8 and 9. It's working properly.
1) Fix your markup code errors; they may not be the whole trouble, but fix them first: [Invalid] Markup Validation of fpsl.eu - W3C Markup Validator. Scroll down in the validation report to see line numbers and source code. Start fixing the code errors and revalidate.
2) You need native IE7+ - not Browsershots - to fully test IE. Find a Windows PC to test with and use F12 dev tools in IE to emulate other versions.
3) Forget IE6; it's dead.
Please see this link. Notice that the search bar first renders near the top of screen. Then aligns itself to be opposite to the logo. I think some css rules are causing this but I am unable to figure out. Can you please help me in pinpointing the reason. What one should avoid in the code to avoid/minimize this behaviour.
This almost aways happens when you have a css rule for blocking that is overwriting the previous. The best thing to do is to have the first thing in the css file to be blocking and normalizing. Every time you need something to be in a place or have a specific size, you should go to the blocking section of your code.
But the most preocupying part of the site you shown is the time it takes to load a fancybox css file.
This issue could just be how each browser loads and renders the content, and also on how fast your network can download content. Since there is many multiple Javascript and CSS files it can just be parsing them slowly and configuring the site as it goes while your network and browser is still downloading and loading everything.
I viewed it in Chrome and Firefox and it seemed to load fine for me.
We have a WordPress website which loads sufficiently in every browser I've tried, except for IE. For some reason in IE, it seems to freeze the browser for a few seconds every single time the page is loaded, doubly so if it has to load a page with an iframe of another page. The user has to wait awhile before they can interact with anything on the page.
Here's the site.
Someone suggested we could use WP Supercache to solve the issue, but I've had problems with this plugin in the past and am reluctant to rely on it, especially since this seems to be only a problem in IE.
What is the best way I can troubleshoot this issue? How do I find out which scripts in the header, or footer, etc. is causing it? Is there a quick way to do so, or do I just need to start eliminating variables within the theme?
I'd don't quite understand why but in IE9 style.css is being pushed right down the page load order - see request #35 http://www.webpagetest.org/result/130327_Y9_f1d5796658d8475b68e2e537644173f1/1/details/
As a browser won't render until it's downloaded the applicable CSS this blocks rendering.
Chrome on the other hand prioritises downloads so that resources that can block rendering are downloaded ahead of images.
Here's a side-by-side video of the two loading experiences.
(If you want help looking at this further my contact details are in my profile)
Thanks to this thread I just found, the answer appears to be fancybox: Fancybox causing slow load times in IE?
Specifically, the IE-specific filters in the CSS file for fancybox. I removed those filter styles, and it loads fine now.
Sorry, I don't seem to be able to give just a comment. Anyway, in Opera 12.14 it works fine. And in Explorer (8) it works just as well, no errors in the console. Just my .1 cent.