为什么在IE加载图像没有显示在页面的底部

Why in IE loading image not show at center bottom of page?

本文关键字:底部 显示 IE 加载 图像 为什么      更新时间:2023-09-26

为什么IE加载图像不显示在页面的中央底部?

此功能是在加载页面上加载内容,并在滚动到底时加载内容。

首先,加载页面index.php,您将在页面的中央底部看到加载图像。

但我在ie 7,8上测试加载没有显示在页面的中央底部,我该怎么做?

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'>

在这两个文件中,无论您使用了.hide()和.show(),都将其替换为以下两个更改:

   .hide() with .css('display','none');
   .show() with .css('display','block');