javascript - Firefox displaying static gif. Works fine in Internet explorer -
please me. have spent amount of time fix without success. following loading modal box works fine in browsers except firefox. in firefox shows static gif image instead of animated loading spin.
html:
<input type="submit" name="submitpayment" value="complete order" class="square checkout button" onclick="showprogressanimation();" /> <div id="loading-div-background"> <div id="loading-div" style="display:none"><img style="margin:30px;" src="images/loading.gif" alt="loading.."/> <p align="center" valign="middle" style="color:##1a0980; font-size:24px; font-weight:normal; text-align:center">please wait while processing order....</p> </div> </div>
java script:
<script type="text/javascript"> $(document).ready(function () { $("#loading-div-background ").css({ opacity: 0.8 }); }); function showprogressanimation() { $("#loading-div-background").show(); var pb = document.getelementbyid("loading-div"); pb.innerhtml = '<img style="margin:30px;" src="images/loading.gif" alt="loading.."/>'; pb.style.display = ''; } </script>
css:
#loading-div-background { display:none; position:fixed; top:0; left:0; /* background:black; */ background-color: #edf1f4; width:100%; height:100%; z-index: 10000; } #loading-div { width: 400px; height: 200px; background-color: #edf1f4; text-align:center; position:absolute; left: 50%; top: 50%; margin-left:-200px; margin-top: -100px; }
Comments
Post a Comment