javascript - Why in IE loading image not show at center bottom of page? -
this question has answer here:
why in ie loading image not show @ center bottom of page ?
this function load content on load page , load content on scroll bottom.
first, load page index.php
see loading image @ center bottom of page.
but test on ie 7,8
loading not show @ center bottom of page , how can ?
index.php
<script src="http://code.jquery.com/jquery-1.7.2.js"></script> <script> // on submit form call function code // $("#f1").submit(send_requests()); </script> <body> <form method="post" id="f1"> <input type="hidden" name="something"/> </form> <div id="loading" style="padding: 0px; margin: 0px; position: fixed; bottom: 135px; right: 50%; width: 36px; height: 24px; z-index: 999999;"> <img src="http://auu-like.com/assets/img/loading.gif"/> </div> <div id="demoajax"> <script> function send_requests(){ $('#demoajax').hide(); $('#loading').show(); $.ajax({ url: 'test1.php', type: 'post', data: $('#f1').serialize(), success: function(data){ $("#loading").fadeout("slow"); $('#demoajax').show(); $('#demoajax').html(data); } }); return false; } // on load page call function code // $(document).ready(send_requests()); </script>
test1.php
<input type="hidden" id="data_to_page_3" value="<?php echo $_post[color_check]; ?>"/> <script type="text/javascript"> var data_to_page_3 = $("#data_to_page_3").val(); var ajax_arry=[]; var ajax_index =0; var sctp = 100; $(function(){ $('#loading').show(); $.ajax({ url:"test2.php", type:"post", data:"userdate="+data_to_page_3+"&actionfunction=showdata&page=1", cache: false, success: function(response){ $('#loading').hide(); $('#demoajax').html(response); } }); $(window).scroll(function(){ var height = $('#demoajax').height(); var scroll_top = $(this).scrolltop(); if(ajax_arry.length>0){ $('#loading').hide(); for(var i=0;i<ajax_arry.length;i++){ ajax_arry[i].abort(); } } var page = $('#demoajax').find('.nextpage').val(); var isload = $('#demoajax').find('.isload').val(); if(($(window).scrolltop() + $(window).height() == $(document).height()) && (isload=='true')){ $('#loading').show(); var ajaxreq = $.ajax({ url:"test2.php", type:"post", data:"userdate="+data_to_page_3+"&actionfunction=showdata&page="+page, cache: false, success: function(response){ $('#demoajax').find('.nextpage').remove(); $('#demoajax').find('.isload').remove(); $('#loading').hide(); $('#demoajax').append(response); } }); ajax_arry[ajax_index++]= ajaxreq; } return false; if($(window).scrolltop() == $(window).height()) { alert("bottom!"); } }); }); </script>
test2.php
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <input type='hidden' class='nextpage' value='".($page+1)."'><input type='hidden' class='isload' value='true'>
in both files wherever have used .hide() , .show() replace following 2 changes :
.hide() .css('display','none'); .show() .css('display','block');
Comments
Post a Comment