ios - Fullscreen background-image with jQuery and Animation -


i using background-size: cover on ipad display fullscreen background-image. on .click(function(){ $(this).addclass('example') }); div changes size. first got:

position: absolute; height: 100%; width: 100%; 

and afterwards got like

height: 50%; width: 50%; 

then, on click sizes changes to

height: 100%; width: 100%; 

but background not scale anymore. how can fix this?

you can see video error ipad right here.

works fine on desktops. live version (div containing background-image named .start-img

for wants dig deeper: on click class .second added div.start-img transforms image. @ first its

.start-img {   background-size: cover;   background-repeat: no-repeat;   background-position: bottom left;   z-index: 1;   transition: 0.5s ease-in-out;   height: 100%;   width: 100%;   position: absolute;  } 

the class added or removed clicking has following attributes:

.start-img.second {     width: 100%;     height: 40%; } 

i guess problem is, background-image stays height: 40% instead of transforming height: 100%. great "force" background-image scale again cover (even if attribute background-size: cover has never changed during process).

it quite special problem. still not know why, there 2 commands using jquery.transit used animate opacity of element. deactivating these 2 lines worked fine me.

maybe ipad got limited amount of animations can take via css transitions?

although had script created function this:

example = function(){    /* other animations , following */    $('.start-img').addclass('second'); }  $('#example').click(example); 

which not work on ipad, while following version works perfect:

example = function(){    /* other animations , following */  }  $('#example').click(function(){    /* other animations , following */    $('.start-img').addclass('second'); }); 

i cannot explain why , open discussion in minimized example.


Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -