为什么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');