仿寫百度百科的目錄樹

2022-07-04 10:36:10 字數 1412 閱讀 7997

1、點選右側的目錄樹,左側跳轉到指定的錨點位置;

2、滾動滑鼠,游標跟隨一起滾動至響應鏈結位置

1、針對第乙個需求,只需要設定游標所在div和右側列表div的position為fixed,根據瀏覽器視窗定位,然後給左側文章各區塊增加id,為右側列表每一項增加對應的href屬性指向響應的錨點即可;

/**定於延時執行函式**/2

var timefun = null;3

/**找到當前頁面滾動到的錨點位置**/4

var findhref = function

() 這段**相當於下面這一句**,優秀的**就應該拿來多學習!*

*/15 maxdistance > curdistancetotop && $links.eq(i).offset().top < windowscrolltop + $(window).height() && (maxdistance = curdistancetotop,result =$links.eq(i))

16});

17return

result;

18};

19/*

**使用jquery建立移動動畫

*/20

var move = function

(dis) ,'normal');23}

24/*

*滾輪事件handler*

*/25

var wheelhandler = function

(e),600);

33};

34/*

**註冊滾輪事件

*/35 $('body').on('mousewheel',wheelhandler);

1、$('.link')[0]返回的是普通的dom物件,而**中使用$('.link').eq(0)返回的是jquery物件,jquery物件才有.offset()方法。

補充說明:eq返回的是jquery物件,而get(n)和索引返回的是dom元素物件。

2、為什麼要使用延時執行函式,並且在wheelhandler中cleartimeout(timefun)?

因為我們正常滾動滑鼠會觸發多次的mousewheel事件,為了防止jquery動畫出現卡頓的現象,將**設計成只在滑鼠滾輪停下來的時候去觸發,cleartimeout做的事情就是只要滑鼠滾輪還在滾動,進入wheelhandler方法,就把前面已加入到延時執行佇列中的方法清除,這樣就可以做到只對最後乙個滾動觸發動畫事件,看上去就好像滑鼠滾輪停止滾動了才去觸發一樣。

AnimateWindow 百度百科

animatewindow 開放分類 程式設計 計算機 api 函式功能 該函式能在顯示與隱藏視窗時能產生特殊的效果。有兩種型別的動畫效果 滾動動畫和滑動動畫。函式原型 bool animatewindow hwnd hwnd,dword dwtime,dword dwflags 引數 hwnd 指...

WCF百度百科

根據微軟官方的解釋,wcf 之前的版本名為 indigo 是使用託管 建立和執行面向服務 service oriented 應用程式的統一框架。它使得開發者能夠建立乙個跨平台的安全 可信賴 事務性的解決方案,且能與已有系統相容協作。wcf是微軟分布式應用程式開發的集大成者,它整合了.net平台下所有...

Mashup 百度百科

mashup是糅合,是當今網路上新出現的一種網路現象,將兩種以上使用公共或者私有資料庫的web應用,加在一起,形成乙個整合應用。一般使用源應用的api介面,或者是一些rss輸出 含atom 作為內容源,合併的web應用用什麼技術,則沒有什麼限制。mashup在geek群體和網際網路玩家之中獲得了極大...