Twitter引導，在手機上將圖像拉伸到全屏

我有一個應用程序，需要拉伸圖像以填充整個屏幕。我使用的twitter引導框架，一切工作在桌面上很好，但在我的銀河s3圖像不縮放。Twitter引導，在手機上將圖像拉伸到全屏

這個頁面的整個SRC看起來是這樣的（不用擔心它的小;））

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
     <meta content="width=device-width, initial-scale=1.0" name="viewport"> 
     <link href="/assets/a4727ffb/css/bootstrap.css" type="text/css" rel="stylesheet"> 
     <link href="/assets/a4727ffb/css/bootstrap-responsive.css" type="text/css" rel="stylesheet"> 
     <link href="/assets/a4727ffb/css/bootstrap-yii.css" type="text/css" rel="stylesheet"> 
     <script src="/assets/44b05ae/jquery.js" type="text/javascript"></script> 
     <script src="/assets/a4727ffb/js/bootstrap.js" type="text/javascript"></script> 
</head> 
<body> 
<style> 
    .container-fluid { 
      padding: 0px; 
    } 
</style> 

<div class="container-fluid"> 
    <div class="row-fluid"> 
      <img alt="camera" src="/index.php/camera/getLatestImage/28?0.660698722382962" style="width:100%;height:100%"> 
    </div> 
</div> 
</body> 
</html>

我想不出任何理由，這是行不通的？該圖像每秒重新加載一些JavaScript，我沒有包含在上面的代碼中。但我認爲這不是問題。

任何幫助將不勝感激，

艾倫

來源

2012-10-11 Alan Hollis

後丹尼爾斯響應我想出了一個方式，謝謝丹尼爾。

<html lang="en"> 
<head> 
     <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
     <meta name="apple-mobile-web-app-capable" content="yes" /> 
     <link href="/assets/a4727ffb/css/bootstrap.css" type="text/css" rel="stylesheet"> 
     <link href="/assets/a4727ffb/css/bootstrap-responsive.css" type="text/css" rel="stylesheet"> 
     <link href="/assets/a4727ffb/css/bootstrap-yii.css" type="text/css" rel="stylesheet"> 
     <script src="/assets/44b05ae/jquery.js" type="text/javascript"></script> 
     <script src="/assets/a4727ffb/js/bootstrap.js" type="text/javascript"></script> 
    <style> 
     html, body {background:none;height:100%; margin:0; padding:0;} 
     .camera-holder {position:fixed; top:0; left:0; width:100%; height:100%;z-index:-1;} 
     </style> 
     </head> 
     <body> 
     <style> 
      .container-fluid { 
        padding: 0px; 
      } 
     </style> 
     <div class="container-fluid"> 
      <div class="row-fluid"> 
     <div class="camera-holder"> 
        <img alt="camera" src="/index.php/camera/getLatestImage/28?0.660698722382962" style="width:100%;height:100%"> 
     </div> 
      </div> 
     </div> 
    </body> 
</html>

來源

2012-10-13 19:20:37

我不腦水腫銀河S3測試，但也許這對你的作品：http://jsfiddle.net/EveAf/1/

來源

2012-10-13 09:34:34 ditscheri

沒有工作:(我想我將不得不最終做的是寫一些基於JavaScript的窗口的寬度/高度， –

PS感謝您抽出時間來回答修改圖片大小。 –

Twitter引導，在手機上將圖像拉伸到全屏

回答

相關問題