CODEWITHSUNDEEP
jquerycsshtmlinternet-explorerinternet-explorer-11
Nate Bradshaw
Nate Bradshaw

Reputation: 59

jQuery & CSS only load after many refreshes

If you open this page in IE11, the CSS and jQuery don't load: http://javasmart.gooberdev.com/

If you refresh the page once, maybe even twice, it still doesn't load. But if you hit F5 a bunch of times in succession, the CSS and jQuery finally load and the page displays correctly.

This is one of the weirdest bugs I've seen yet and frankly I have no idea what is causing it. **Only occurs in IE. Chrome and Firefox work fine.

Magento head.phtml document:

<meta http-equiv="Content-Type" content="<?php echo $this->getContentType() ?>" />
<title><?php echo $this->getTitle() ?></title>
<meta name="description" content="<?php echo htmlspecialchars($this->getDescription()) ?>" />
<meta name="keywords" content="<?php echo htmlspecialchars($this->getKeywords()) ?>" />
<meta name="robots" content="<?php echo htmlspecialchars($this->getRobots()) ?>" />
<link rel="icon" href="<?php echo $this->getFaviconFile(); ?>" type="image/x-icon" />
<link rel="shortcut icon" href="<?php echo $this->getFaviconFile(); ?>" type="image/x-icon" />

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
<!--[if lt IE 7]>
<script type="text/javascript">
//<![CDATA[
    var BLANK_URL = '<?php echo $this->helper('core/js')->getJsUrl('blank.html') ?>';
    var BLANK_IMG = '<?php echo $this->helper('core/js')->getJsUrl('spacer.gif') ?>';
//]]>
</script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="/skin/frontend/magpassion/relank/css/custom.css" media="all" />
<script type="text/javascript" src="http://fast.fonts.net/jsapi/ea7ed50d-f26c-4089-bf7d-063665c359e7.js"></script>
<link href='http://fonts.googleapis.com/css?family=Roboto:400,500,400italic,500italic' rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
<?php echo $this->getCssJsHtml() ?>

<?php echo $this->getChildHtml() ?>
<?php echo $this->helper('core/js')->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>

Upvotes: 0

Views: 125

Answers (1)

Equalsk
Equalsk

Reputation: 8194

I only get the problem when IE pays attention to the X-UA tag in your header to force IE8 standards. A bunch of JavaScript fails to load and the rest of the page falls over.
If I ignore this tag and render with Edge using F12 the page always works flawlessly for me.

<meta http-equiv="X-UA-Compatible" content="IE=8" />

There's a good post on it here:

"X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE"

Upvotes: 2

Related Questions