4

我有一个应用程序需要拉伸图像以填满整个屏幕。我正在使用 twitter 引导框架,并且在桌面上一切正常,但在我的 Galaxy s3 上,图像无法缩放。

页面的整个 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 重新加载。但我认为这不是问题。

任何帮助将不胜感激,

艾伦

4

2 回答 2

4

在丹尼尔斯回应后,我想出了一个办法,谢谢丹尼尔。

<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-13T19:20:37.063 回答
1

我没有 Galaxy S3 来测试,但也许这对你有用:http: //jsfiddle.net/EveAf/1/

于 2012-10-13T09:34:34.990 回答