Question

我正在尝试使用jQuery中的PHP代码在同一页面上实现平滑滚动（尝试使用PHP生成最终的jquery代码）。但由于某种原因，它无法正常工作，如果有人能够指出错误或为什么它不起作用，我会很感激

// When the Document Object Model is ready
   jQuery(document).ready(function(){
   // 'scroll' is the amount of pixels destination
   // is from the top of the document
   var scroll = jQuery('<?php echo get_option('smooth_scroll'); ?>').offset().top;

// When button is clicked
  jQuery('.test').click(function(){
   // Scroll down to 'scroll'
   jQuery('html, body').animate({scrollTop:scroll}, 'slow');
   // Stop the link from acting like a normal anchor link
   return false;
  });
});

我有一个带有“test”类的href链接。单击该按钮时，我希望它平滑滚动以转到同一页面的特定div [thru get_option（'smooth_scroll'）] div将由用户更新。

Answer 1

首先 - 请尝试将滚动变量赋值移动到click事件中：

jQuery(function(){
  jQuery('.test').on('click', function(e){
    e.preventDefault();
    var scroll = jQuery('<?php echo get_option('smooth_scroll'); ?>').offset().top;
    jQuery('html, body').animate({scrollTop:scroll}, 'slow');
  });
});

因为当前你的元素不在其最终位置时会出现这种情况 - 因为它是在DOMContentLoaded事件上计算的，该事件在加载完整的DOM结构后被调用，但是CSS / JS /图像资产在此处无法加载什么会影响计算结果。

同一页面上的平滑滚动无效

1 个答案: