Javascript/jquery在窗口中找到最頂部的段落

有人可以告訴我一種方式在HTML文檔中查找瀏覽器窗口中可見的第一段。意思是我希望第一段不在文檔內（可能大於窗口區域），但在瀏覽器窗口（可見屏幕）內。Javascript/jquery在窗口中找到最頂部的段落

* PS不是讓所有的「P」的元素在文檔和遍歷找到其他的第一個可見 *

2013-02-22 Vegito1044

我懷疑如果不循環所有「p」標記，這是可能的。 – 2013-02-22 13:41:57

有一個[如何對告訴-IF-A-DOM的元素是 - 可見光 - 內式電流視口] [1] [1]：HTTP：//計算器。 com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport – 2013-02-22 13:52:36

謝謝你會看到它是否有幫助！ – Vegito1044 2013-02-24 05:51:13

我認爲這是你想要什麼：

$("p:visible:first")

來源

2013-02-22 13:42:31 gustavohenke

如果我理解他的話，他想要在當前可見區域獲取第一個「p」，而不是全部文檔。 jQuery http://api.jquery.com/visible-selector/上的 – 2013-02-22 13:43:15

他們提到「可見元素的寬度或高度大於零。」但是在視口顯示區域內沒有任何可見**的內容。 – 2013-02-22 13:49:12

這應該工作：

$(document).ready(function(){ 
    var paragraphs = $('p'); 
    var scrollTop = $(window).scrollTop(); 
    var scrollBtm = scrollTop + $(window).height(); 
    paragraphs.each(function(e){ 
     var top = $(this).offset().top; 
     if (top > scrollTop && top < scrollBtm){ 
      alert("Win"); 
      return false; 
     } 
    }); 
});

編輯：我意識到這是traversin g p標籤，但至少在「返回false」的情況下，你不會遍歷每一個，只是當前視圖上方的每一個。

編輯2：創建段落上的document.ready

來源

2013-02-22 13:49:58 Maloric

感謝您的幫助！但隨着用戶向下滾動越來越多，它將需要更多的時間，所以不會在大尺寸的HTML文檔中做得更好 – Vegito1044 2013-02-24 05:55:16

如果您正在尋找距離屏幕頂部最近的p標籤，那麼關於我認爲的唯一選項你有。但是，如果您滾動查看文章，博客條目等，並且想要突出顯示其中一個標籤的頂部p標籤，則可以將其分割爲div或部分標籤以增加搜索時間。 – Aaron 2013-02-25 03:33:40

爲了讓腳本更高效，我能想到的第一件事就是在文檔加載時一次獲取段落的jQuery對象，而不是每次您想檢查（修改我的上述代碼來完成此操作）。除此之外，您還可以在開始時使用jQuery數據函數將偏移頂部座標附加到每個段落，但這些座標可能會根據頁面而改變。 – Maloric 2013-02-25 08:58:11

陣列有一個jQuery插件這一點，你可以給一個嘗試：www.appelsiini.net/projects/viewport

來源

2013-02-22 13:56:43

，會試試看！ – Vegito1044 2013-02-26 09:26:15

你能想出某種機制根據它們的偏移量來標記你的p標籤。所以，當頁面加載時，你將不得不循環你的p標籤（或更好的部分），並根據它們的偏移位置標記它們。然後，將用戶的當前滾動位置與最近的偏移量p進行比較將是一件簡單的事情...

來源

2013-02-25 03:28:27 Aaron

Javascript/jquery在窗口中找到最頂部的段落

回答

相關問題