Member Avatar for Nomorewine

Hello.
Here is the problem:
JS

 $(".spinBox").css("display","block");
 //....
 $(".spinBox").css("display","none");

CSS:

.spinBox {display:none; z-index:6; position:absolute; top:-45px; left:0; bottom:0; right:0; background:rgba(0,0,0,0.5); }
.spinBox img {position:absolute; display:block; width:50px; height:50px; margin:auto; top:0; left:0; bottom:0; right:0;}

HTML:

<div class="spinBox">
    <img id="spinImg" src="images/bg/spinner.png" alt="spinner" />
</div>

All that works fine in webview in Gingerbread and Jelly Bean. But in Ice cream sandwich works like 30 out of 100 times. The spinner would rotate(css keyframes) until I touch the screen. It seems like there is no redraw until screen is touched.Perhaps you had expirienced something similar. Please help me. Thanks.

  • 1 Contributor
  • 1 Reply
  • 197 Views
  • 4 Hours Discussion Span
  • Latest Post Latest Post by Nomorewine
Member Avatar for Nomorewine

have no idea what was wrong, but putting this

if($('.spinBox').css('display') == "block"){
           $('.spinBox').css('display', 'none');
       }

after

$(".spinBox").css("display","none");

fixed the issue.
So setting display to none twice with some time difference solved the problem.
The problem is solved but I will continue on investigating this some more. It's possible that the problem is in my code.(but then again, it was working on 4.1.x and 2.3.3 but not on 4.0.4 . tested on real devices.) Weird o.O

Edited by Nomorewine because: update
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.