Respond.js on Subdomain using Tumblr

為{幸葍}努か 提交于 2019-12-06 07:54:39

To quote the respond.js readme:

Respond.js works by requesting a pristine copy of your CSS via AJAX, so if you host your stylesheets on a CDN (or a subdomain), you'll need to upload a proxy page to enable cross-domain communication.

– my emphasis. The cross-domain version is meant to enable you to process stylesheets loaded from another domain than the one respond.js is working on. In the case of Tumblr, however, you have a third domain added to the mix: static.tumblr.com, where your proxy script and gif have landed. That cannot, and will not, work.

@Steve Chab,

There are two reasons respond.js & respond.proxy.js were not working for you.

  1. You had the respond-proxy.html file in the origin domain, whereas the file should have been served from your sub-domain (blog.stevechab.com) or any other external domain.

  2. There seems to be a bug with respond.js / respond.proxy.js when linking to a css file with a relative url. To fix it, use an absolute url. Your main site uses a relative url for the css stylesheet, and your blog an absolute url.

    • Note: Bug is caused by respond.proxy.js ajax/xml functions


Please find below, the re-vised working markup to get respond.js & respond.proxy.js working on your website.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="http://www.stevechab.com/styles/styles.css">
<!--[if (lt IE 9) & (!IEMobile 7)]>
<link href="//blog.stevechab.com/scripts/respond-proxy.html" id="respond-proxy" rel="respond-proxy">
<link href="//www.stevechab.com/scripts/respond.proxy.gif" id="respond-redirect" rel="respond-redirect">
<![endif]-->
</head>
<body>
<!-- Your content goes here. -->

<!--[if (lt IE 9) & (!IEMobile 7)]>
<script src="//www.stevechab.com/scripts/respond.min.js"></script>
<script src="//www.stevechab.com/scripts/respond.proxy.js"></script>
<![endif]-->
</body>
</html>
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!