![](/img/trans.png)
[英]How do I create a footer that is fixed at the bottom of the screen but when the user scrolls down it is no longer fixed footer?
[英]How do you make an Ajax call when a user scrolls down to the bottom of the screen
當用戶向下滾動到屏幕底部時,我想撥打Ajax電話。 由於某種原因,我的代碼無法正常工作。 我認為這可能是語法錯誤,但是我檢查了控制台,但沒有看到錯誤。 歡迎任何建議,改進或示例。
<div id="content">
<?php include('post-1.php'); ?>
</div>
<div id="loading-image" style="display: none;"></div>
<div id="part2"></div>
<script>
window.onscroll = function(ev) {
if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
$('#loading-image').show();
$.ajax({
url: "<?php echo get_stylesheet_directory_uri();?>/post-2.php",
cache: false,
success: function(html){
$("#part2").html(result);
},
complete: function(){
$('#loading-image').hide();
}
});
}
};
</script>
function CallAjax(){
$.ajax({
url: "<?php echo get_stylesheet_directory_uri();?>/post-2.php",
cache: false,
success: function(html){
$("#part2").html(result);
},
complete: function(){
$('#loading-image').hide();
}
});
}
$(window).scroll(function() {
var divTop = $('#yourDivId').offset().top,
divHeight = $('#yourDivId').outerHeight(),
wHeight = $(window).height(),
windowScrTp = $(this).scrollTop();
if (windowScrTp > (divTop+divHeight-wHeight)){
console.log('reached');
// add your ajax method here;
CallAjax();
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.