怎么去掉ionic的scroll属性

怎么让背景图和内容同时滑动?
<ion-view id="view-account-signUp" view-title="{{setTitle('注册')}}" ng-controller="TibetRegisterCtrl" ng-form="userForm">

<ion-header-bar >
    <a class="button button-clear icon-left ion-ios-arrow-left"
       ng-click="back()"></a>
    <div class="title">注册</div>
    <!--<a class="button button-clear"  ng-disabled="userForm.$invalid" ng-click="submit()">下一步</a>-->
</ion-header-bar>
<ion-content class="padding-top " scrolling="no" style="background-color: transparent;background-image: url(/res/img/view/tibet/bg-1.png?v=1);background-repeat: no-repeat;background-size: 100%" >
    <div class="item text-center u-border-none" style="background-color: transparent;margin-top: 110px;padding: 0" ng-click="choosePhoto();">
       <img id="avatarImg" style="width: 70px;height: 70px;background-image: url(/res/img/view/tibet/logo-s.png?v=1);background-size: 100%;">
        <!--<i class="u-icon-avatar-default u-icon"  style="padding: 18px 28px" id="signUp-avatarIcon" ></i>-->
    </div>
    <div style="background-color: transparent;color: #b52d2e;margin:5px 10px 10px 12px">*以下所有为必填哦!</div>
    <div class="list u-list" style="background-color: transparent;">
        <div class="item item-input u-item-icon-btn u-item-first" style="border: 1px solid #b5b6b7;height: 25px; border-radius: 5px;padding: 0;">
            <i style="background-color: #e7ba41;width: 20vw;;height: 25px;padding: 6px">手机号码</i>
            <input  type="text" name="mobile" maxlength="15"style="margin-left: 0;"
                   u-field="fields.mobile"
                   ng-model="fields.mobile.value" required>
            <a class="button button-icon  ion-ios-close placeholder-icon" ng-show="fields.mobile.value"
               style="padding: 6px 0;margin-right:5px;line-height: 23px;"
               ng-click="clearInput('mobile')"></a>
            <a class=" button u-btn-verify button-small "
               ng-click="getVerifyCode()" style="width:100px;;border-radius: 0;padding: 0;background-color: #b5b6b7;"
               ng-disabled="data.verifyCodeForm.remainTime || data.verifyCodeForm._isFetchingVerifyCode">
                <span ng-show="!data.verifyCodeForm.remainTime">获取验证码</span>
                <span ng-show="data.verifyCodeForm.remainTime">重新发送({{data.verifyCodeForm.remainTime}})</span>
            </a>
        </div>
        <label class="item item-input" style="padding: 6px 0;border: 1px solid #b5b6b7;border-radius: 5px;height: 25px;margin-top: 5px;">
            <i style="background-color:  #e7ba41;width: 20vw;;height: 25px;padding: 6px">验证码</i>
            <input type="text" ng-model="fields.verifyCode.value"
                   u-field="fields.verifyCode"
                   maxlength="6" name="verifyCode"style="margin-left: 0;">
            <input type="hidden" ng-model="data.verifyCodeForm.tempAccessToken" name="tempAccessToken">
        </label>
        <a class="u-item-after-btn button button-icon  ion-ios-close placeholder-icon"
           style="margin-right: 5px;"
           ng-show="userForm.verifyCode.$valid" ng-click="clearInput('verifyCode')"></a>
        <label class="item item-input u-item-icon-btn " style="border: 1px solid #b5b6b7;margin-top: 5px;height:25px;
           padding: 0;border-radius: 5px;">
            <i style="background-color:  #e7ba41;width: 20vw;;height: 25px;padding: 6px">密码</i>
            <input type="password" ng-model="fields.password.value" maxlength="16"  style="margin-left: 0;"name="password" required>
        </label>
        <a class="u-item-after-btn button button-icon  ion-ios-close placeholder-icon"
           ng-show="userForm.password.$valid" ng-click="clearInput('password')"></a>
        <div class="item item-input u-item-icon-btn u-item-first" style="border: 1px solid #b5b6b7;margin-top: 5px;height: 25px;
           padding: 0;border-radius: 5px;">
            <i style="background-color:  #e7ba41;width: 32vw;;height: 25px;padding: 6px">城市</i>
            <input type="text" name="city" style="margin-left: 0;"
                   u-field="fields.city"
                   ng-model="fields.city.value" required>
            <a class="button button-icon  ion-ios-close placeholder-icon" ng-show="fields.city.value"
               style="padding-right: 78px;padding: 6px 0;margin-right:5px;line-height: 23px;"
               ng-click="clearInput('city')"></a>
            <a ng-click="toCityCode()" style="height: 26px;width: 45%;text-align: right;min-width: 14px;">
                <i ng-bind="currentAreaCode" style="display:block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;line-height: 28px;;font-size: 13px;color: #999;"></i>
            </a>
            <i class="icon ion-ios-arrow-right" style="line-height: 10px;text-align: right;padding-right: 0;margin-right: 10px;"></i>
        </div>
        <label class="item item-input u-item-icon-btn " style="border: 1px solid #b5b6b7;margin-top: 5px;height: 25px;
           padding: 0;border-radius: 5px;">
            <i style="background-color:  #e7ba41;width: 20vw;;height: 25px;padding: 6px">身份证号</i>
            <input type="text" ng-model="fields.identity.value" maxlength="16"  style="margin-left: 0;"name="identity" required>
        </label>
        <a class="u-item-after-btn button button-icon  ion-ios-close placeholder-icon"
           ng-show="userForm.identity.$valid" ng-click="clearInput('identity')"></a>
    </div>
    <div style="font-size: 18px;text-align: center;margin-top: 20px;font-weight: bold;background-color: transparent">您离报名成功只差一步!</div>
    <div class="padding" style="text-align: center;padding: 0;margin-top: 20px;background-color: transparent">
        <a class="button " style="background-color: #e7ba41;width: 59vw;display: inline-block;
        border-radius: 5px;min-height: 30px;line-height: 30px;" ng-click="submit();">马上发布技能完成报名</a>
    </div>
</ion-content>
<input id="_photoFile" type="file" class="hide" accept="image/png,image/jpeg"  capture="camera" file-model="photoFile">

</ion-view>

需要实现的样子
图片描述
可是我做好的效果是这样,当需要输入文字的时候,最下面的背景反而变白了,而且内容会跳上去。

图片描述

阅读 2.9k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题