2016-05-09 2 views
0

У меня есть мое приложение для Ionic, но оно не работает, как в браузере ... например, фоновое изображение не загружается. Кто-нибудь знает, почему?Ионное отклонение браузера устройства

Все, включая API, что приложение взаимодействует с, хранится локально

enter image description here

Вот вид:

<ion-view title="Login" id="page2" hide-back-button="true" hide-nav-bar="true"> 
    <ion-content overflow-scroll="false" padding="true" 
       style="background: url('../img/loginBackground.jpg') no-repeat center;background-size:cover;"> 
     <form class="list"> 

      <style scoped> 
       .inputCustom{ 
        background-color: rgba(255,255,255,0.8); 
       } 

       .imgBack{ 
        display: block; 
        margin-left: auto; 
        margin-right: auto; 
        overflow: visible; 
        min-width: 60vw; 
        max-height: 60vw; 
        max-width: 60vw; 
       } 
      </style> 


      <img src="../img/logo.gif" class="imgBack"> 

      <div class="spacer" style="height: 60px;"></div> 

      <ion-list> 
       <label class="item item-input inputCustom"> 
        <span class="input-label">E-mail</span> 
        <input type="email" placeholder="" ng-model="user.email"> 
       </label> 
       <label class="item item-input inputCustom"> 
        <span class="input-label">Lozinka</span> 
        <input type="password" placeholder="" ng-model="user.password"> 
       </label> 

       <div class="animated flash" ng-show="validationBool" 
        style="text-align: center; padding-top: 5px; color: indianred">{{validationError}} 
       </div> 

      </ion-list> 
      <div class="spacer" style="height: 40px;"></div> 
      <a ng-click="signIn()" id="login-button1" class="button button-positive button-block">Prijavi se</a> 
      <a ui-sref="signup" id="login-button2" class="button button-positive button-block button-clear">Nemaš račun? Registriraj se</a> 
     </form> 
    </ion-content> 
</ion-view> 
+0

, где ваш код? – Atula

+0

С его странной проблемой я не знал, что вставить? Просмотр, контроллер, все? – Norgul

+0

на данный момент вставьте код, в котором вы используете фон, и хорошо ли он работает на эмуляторе или мобильном устройстве? – Atula

ответ

0

что я понимаю, в том, что вы получаете проблемы в показывая изображения в ионном. Итак, вот решение. Проблема в коде здесь

background: url('../img/loginBackground.jpg') 

Вы не дали правильный URL для вашего image.This должно быть.

background: url('/img/loginBackground.jpg') 

Примечание: Нет точек и ваше изображение не будет в "WWW/IMG".
То же самое для img tag.

EDIT:
попробовать этот

.scroll-content { 
background:url(/img/loginBackground.jpg) no-repeat center; 
background-size: cover; 

и удалить стиль bavckground от ионного состава.

+0

Когда я так выразился, он говорит в IDE «Не удается разрешить каталог». Но он по-прежнему отображается в браузере, но ничего не меняется на устройстве – Norgul

+0

Ну, я не знаю, работает ли все другое, потому что мое устройство не общается с localhost. Я заметил, что если я изменю путь к /www/img/loginBackground.jpg, то IDE показывает это хорошо, но в браузере отображается то же изображение (или нет изображения), которое я вижу на устройстве ... – Norgul

+0

Я обновил свой код. – Atula

0

Я узнал, что предыдущая косая черта вызывала проблему. Правильный путь

<ion-content overflow-scroll="false" padding="true" 
       style="background: url(img/loginBackground.jpg) no-repeat center;background-size:cover;"> 

А для логотипа:

<img src="img/logo.gif" class="imgBack">