2016-12-28 2 views
0

В {N}, можно ли изменить изображение backgroundPosition?В {N} можно ли анимировать изображение backgroundPosition?

Думайте, что ответ будет отрицательным.

В этом случае любой пользователь пытается сделать анимацию, используя setInterval() или что-то подобное - будет ли это работать (и выглядит относительно гладко)?

ответ

0

Вы пробовали это?

.thing{ 
    display:block; 
    height:300px; 
    width:300px; 
    background:url('http://4.bp.blogspot.com/-WeXXx2gmVlY/VNiy484uYoI/AAAAAAAAAsU/XeTgzY9k-Us/s1600/Gambar-Keren-Unik-DP-BBM-Terbaru9.jpg') no-repeat; 
    background-position:-300px; 
    border:1px solid grey; 
    -webkit-transition:background-position 1s ease; 
} 

.thing:hover{ 
    background-position:0px; 
    color:red; 
} 

http://jsfiddle.net/hfXSs/882/ Вы должны быть более spesific

0

{N} + Angular2 Вы можете сделать это:

В HTML:

<StackLayout class="bg" [style]="'background-position:'+translateValue+' 
'+translateValue+';'"> 
    <Label [text]="translateValue"></Label> 
<StackLayout> 

В CSS:

.bg { 
    background-image: url("res://bg"); 
    background-size: cover; 
    background-repeat: repeat; 
} 

В some.component:

export class SomeComponent implements OnInit { 
    public translateValue:number = 0; 
    constructor() { 
     setInterval(()=>{ 
     this.translateValue++; 
     },50); 
    } 
} 

Я знаю, что это не является хорошим решением, но это работает.

Смежные вопросы