滾動一個iframe，而不必鼠標移動它

Question

我有一個iframe用於顯示我的網頁的主要內容;不過，無論鼠標指向何處，我都想讓IFRAME滾動。我不希望我的訪問者因無法滾動而感到困惑，除非他們的鼠標懸停在iframe上。這可能嗎？用鼠標懸停在身體​​上的任何地方滾動iframe？

我不會鏈接任何代碼，因爲我唯一相關的代碼是iframe> </iframe>標記<。

（身體本身不可滾動，隱藏滾動條）

Answer 1

好的。我放在一起爲這個相當快速和骯髒的解決方案，包括以下步驟：

• 添加一個「id」你元素。 （在我的示例中，我使用了id="myFrame"）
• 將jQuery Mousewheel插件連同最新的jQuery一起添加到您的html頁面的標題中。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script type="text/javascript" src="https://raw.github.com/brandonaaron/jquery-mousewheel/master/jquery.mousewheel.js"></script> 

• 最後在HTML主體的端部或的IFRAME本身後添加以下JavaScript代碼。

<script type="text/javascript"> 
    var scrolloffset = 30; // amount of scrolling per mousewheel step 

    var myFrame = $('#myFrame'); // the iframe ID 
    var frameScrollPosition = 0; 

    $(window).mousewheel(function(event,delta){ 

     // reset stored offset so that it matches with iframe's 
     frameScrollPosition = myFrame.contents().scrollTop(); 

     var frameHeight = myFrame.contents().height() - myFrame.height(); 

     if(delta > 0){ 
      var newPosition = frameScrollPosition - scrolloffset; 
     } else { 
      var newPosition = frameScrollPosition + scrolloffset; 
     } 

     if(newPosition < 0){ 
      newPosition = 0; 
     } 

     if(newPosition >= frameHeight){ 
      newPosition = frameHeight; 
     } 

     frameScrollPosition = newPosition; 
     myFrame.contents().scrollTop(frameScrollPosition); 

    }); 
</script> 

確保您download插件，並從GitHub像我這樣不叫。這只是爲了測試和概念驗證。