Respond.js mit twitter bootstrap auf ie8 und unten

ich bin Umsetzung einer responsive website mit twitter bootstrap, aber auf der iexplorer 8 und unten nicht verwenden können media queries.

Erstelle ich ein einfaches Beispiel für versuchen respond.js aber mediaqueries weiterhin nicht im iexplorer 7-8, hier ist der html:

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Bootstrap 101 Template</title>
<meta name="Description" content="Web description here" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" >
<link href="./css/styles.css" >
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link  href="./img/favicon.png">
</head>
<body>
<div class="container">
  <h1>Hello, world!</h1>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="./js/respond.min.js"></script>
<script src="./js/scripts.js"></script>
</body>
</html>

und hier ist der Stil.css:

@media only screen and (max-width: 38.75em) {
body {
    background: green;
}
}

Hinsichtlich

InformationsquelleAutor Kermit | 2013-07-08
  1. 2

    https://github.com/scottjehl/Respond#cdnx-domain-setup

    CDN/X-Domäne, Setup

    Respond.js funktioniert durch das anfordern einer unberührten Kopie der CSS per AJAX, so dass, wenn Sie hosten Ihre stylesheets auf einem CDN (oder subdomain), müssen Sie zum hochladen einer proxy-Seite, um ermöglichen cross-domain-Kommunikation.

    Sehen cross-domain/example.html für eine demo:

    Upload cross-domain/respond-proxy.html to your external domain
Upload cross-domain/respond.proxy.gif to your origin domain
Reference the file(s) via <link /> element(s):

<!-- Respond.js proxy on external server -->
<link href="http://externalcdn.com/respond-proxy.html" id="respond-proxy"  />

<!-- Respond.js redirect location on local server -->
<link href="/path/to/respond.proxy.gif" id="respond-redirect"  />

<!-- Respond.js proxy script on local server -->
<script src="/path/to/respond.proxy.js"></script>

    Wenn Sie Probleme mit dem cross-domain-setup, stellen Sie sicher, respond-proxy.html nicht über ein query-string angehängt.

    Hinweis: vielen Dank an @doctyper für die Beiträge in der cross-domain proxy!

    • Dank Craig. Dieser ist direkt von den docs aber es ist nicht wirklich das problem zu beheben. Sie können nicht laden Sie die HTML-Datei auf Bootstrap CDN, so müssen Sie einfach Graben die CDN?
    • Simon, um ehrlich zu sein, ich habe keine Zeit zu lösen, dass die Frage noch nicht. Ich weiß, es ist möglich. In der Zwischenzeit habe ich nur den Rückgriff auf über das lokale CSS für Bootstrap und CDN für alles, was ich kann, der braucht sich nicht eingestellt respond.js. Wenn Sie die Antwort finden, bitte posten! =)
    InformationsquelleAutor Craig London
  2. 0

    Müssen Sie <script src="./js/respond.min.js"></script> über die </head> tag.

    • Oben </head> und sofort nach der stylesheets
    • respond.js sollte funktionieren, selbst wenn geladen unten auf dem HTML-Dokument, du bist einfach eher zu einem FOUC. Ich denke, das eigentliche Problem ist, dass respond.js nicht ziehen in stylesheets aus anderen Domänen (z.B. die Bootstrap-CDN).
    InformationsquelleAutor alias51
  3. 0

    Wenn Sie nicht möchten, fügen Sie beliebigen code im Zusammenhang mit respond.js laden bootstrap.min.css durch CDN, außer für den IE 8. Für den IE 8 verwenden Sie lokale statische Datei.

        <!--[if lte IE 8]>                                                      
        <link  href="/path/to/bootstrap.min.css' %}" />
    <![endif]-->                                                            
    <!--[if gt IE 8]>                                         
        <link  href="{CDN Address}" />                                                      
    <![endif]-->                                              
    <!--[if !IE]><!-->                                        
        <link  href="{CDN Address}" />
    <!--<![endif]-->

    Getestet auf IE 8 ~ 11 und anderen webkit-Browsern.

    InformationsquelleAutor Chemical Programmer
Schreibe einen Kommentar