如何滾動流JQuery用戶界面對話框

Question

我一直在嘗試使用遵循滾動到與移動用戶滾動一起對話框，但沒有成功

<script> 
$(function() { 
    $("#dialog:ui-dialog").dialog("destroy"); 
    $("#dialog-report-problem-form").dialog({ 
     autoOpen: true, 
     height: 550, 
     width: 700, 
     modal: true, 
     buttons: { 
      "<?= $this->translate('REPORT_PROBLEM'); ?>": function() { 
       reportProblem(); 
      }, 
      "<?= $this->translate('CANCEL'); ?>": function() { 
       $(this).dialog("close"); 
      } 
     }, 
     close: function() { 
     } 
    }); 
    $.scrollFollow("#dialog-report-problem-form",{speed: 10}); 
}); 
</script> 

。

<div id="dialog-report-problem-form" title="<?= $this->translate('REPORT_PROBLEM'); ?>"> 
    <?= $this->form ?> 
</div> 

我已經收到了錯誤

box.cont.offset() is null 

有誰知道怎麼能解決或其他基於jQuery的解決方案來跟蹤用戶滾動？

Answer 1

插件scrollFollow似乎是相當馬車和發展停產（2008年最後一次更新）

• 當你$.scrollFollow()使用它，默認選項沒有設置值，所以你得到了很多的錯誤就像你得到的那個一樣。
• 與$(...).scrollFollow使用時，主要選擇容器，它並沒有真正的工作是不正確獲得 ...

這裏是一個小腳本，將移動時滾動窗口周圍的對話框：

(function(wnd, $) { 

     // query for elements once 
    var $dlg = $("#dialog-report-problem-form").parent(), 
     $wnd = $(wnd), 
     // get the initial position of dialog 
     initialTop = $dlg.offset().top - $wnd.scrollTop(); 

    $wnd.scroll(function() { 
      // when qscrolling, animate the 'top' property 
      $dlg.stop() 
       .animate({ 
        "top": ($wnd.scrollTop() + initialTop) + "px" 
       }, "slow"); 
     }) 
     .resize(function() { 
      // in case of resize, re-set the initial top position of the dialog 
      initialTop = $dlg.offset().top - $wnd.scrollTop(); 
     }); 

    // if you close/open the dialog, it will mess up the 'initialTop' 
    // this will re-set the correct 'initialTop' when the dialog opens again 
    $dlg.bind('dialogcreate dialogopen', function(e) { 
     initialTop = $dlg.offset().top - $wnd.scrollTop(); 
    }); 

})(window, jQuery); 

工作示例jsfiddle。