背景图像自身调整大小

时间:2016-05-08 12:24:17

标签: css angularjs ionic-framework

我有点desesparate,我尝试了多个东西,没有任何工作。所以我的问题如下: 每次我点击一个输入字段,背景自己调整大小,底部和顶部都有一个空白区域。

我添加了: cordova.plugins.Keyboard.disableScroll(真);

.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    cordova.plugins.Keyboard.disableScroll(true);
    if (window.cordova && window.cordova.plugins.Keyboard) {
        cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
        // org.apache.cordova.statusbar required
        StatusBar.styleDefault();
    }
});

})

的login.html

<ion-view view-title="Login" align-title="left">
<ion-content class="background">
    <div class="hero no-header flat">
        <div class="content" style="bottom: 0px;">
            <div class="app-icon"></div>
            <h1 style="text-transform: uppercase;">App</h1>
        </div>
    </div>
    <div class="list padding" style="margin-top: 25px;">

        <label style="margin-bottom: 20px; display: block;">
          <input type="text" placeholder="Adresse e-mail" ng-model="data.email" class="customInput">
        </label>
        <label style="margin-bottom: 20px; display: block;">
          <input type="password" placeholder="Mot de passe" ng-model="data.password" class="customInput">
        </label>
    </div>
    <div class="button-bar padding">
        <button class="button button-small button-border icon-left ion-social-google button-assertive-900" ng-click="login(data)">Connexion</button>
        <button class="button button-small button-border icon-left ion-social-facebook button-positive-900">Facebook</button>
    </div>
    <div class="padding">
        <button class="button button-full button-register ink" ui-sref="app.register">Créer votre compte</button>
    </div>
</ion-content>

    .background.scroll-content {
    background: url('../img/login.jpg') no-repeat;
    background-size: cover;
    background-position: center;
    margin: auto;
    z-index: 2; 
}

问题在于,当显示键盘时,背景调整大小或键盘将背景图像向上推。

1 个答案:

答案 0 :(得分:0)

嗯,请更好地解释一下。我在这里试过你的代码:http://play.ionic.io/app/e9abbb2a5670但我没有错。