-
特效分析：查看全部
-
本案例中的網頁定位導航特效主要是指在頁面內進行定位導航，適用于內容比較多的單頁面網頁。查看全部
-
jQuery 事件： offset()事件：獲取匹配元素的相對偏移。返回的對象包含兩個整型屬性：top和left，單位是px。 scrollTop()事件：獲取/設置匹配元素的相對滾動條頂部的偏移。 scroll()事件：當用戶滾動指定的元素時，會發生scroll事件。scroll事件適用于所有可滾動的元素和window對象（瀏覽器窗口）查看全部
-
特效所需要掌握的技術點查看全部
-
jQuery 事件： offset()事件：獲取匹配元素的相對偏移。返回的對象包含兩個整型屬性：top和left，單位是px。 scrollTop()事件：獲取/設置匹配元素的相對滾動條頂部的偏移。 scroll()事件：當用戶滾動指定的元素時，會發生scroll事件。scroll事件適用于所有可滾動的元素和window對象（瀏覽器窗口）查看全部
-
解決IE6不兼容fixed屬性的方法，在css中加入： /*ie6 hack*/ *html,*html body{ background-image:url(about:blank); background-attachment:fixed; } *html menu{ position:absolute; top:expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
通過hack解決ie6不支持position:fixed的辦法 /*ie6 hack*/ * html, * html body { background-image: url(about:blank); background-attachment: fixed; } * html #menu { /*position: fixed;*/ position: absolute; top: expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
通過hack解決ie6不支持position:fixed的辦法 /*ie6 hack*/ * html, * html body { background-image: url(about:blank); background-attachment: fixed; } * html #menu { /*position: fixed;*/ position: absolute; top: expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
1、讓右側廣告正確顯示： #content .item{ position: relative; height: 540px; } 2、讓導航菜單在左側固定定位顯示： #menu { position: fixed; top: 100px; } 3、讓導航菜單實現在滾動時自動設置焦點： items.each(function() { var m = $(this); if(top > m.offset().top - 200) { currentId = m.attr("id"); } else { return false; } }); var curLnk = menu.find(".current"); if(currentId && curLnk.attr("href") != currentId) { curLnk.removeClass("current"); menu.find("[href=" + currentId + "]").addClass("current"); }查看全部
-
網頁定位導航特效中，導航條和滾動條之間的關系：導航條隨著滾動條的滾動改變焦點，其實就是給相應的項目增加樣式查看全部
-
解決問題的流程：分析 -> 設計 -> 實現 分析（要實現的功能）： 1、左側內容+右側導航條； 2、左側滾動時，右側導航的位置不變； 3、左側滾動到某個欄目時，右側定位到相應鏈接； 4、點擊右側鏈接時，左側定位到相應欄目。 難點： 1、左右側的樣式； 2、左右側的定位關聯（思路見圖）： A、B、C分別為1F、2F、3F到視窗頂端的距離； S1、S2表示滾動條的位置，若滾動條在B、C之間，表示目前滾動到2F，此時2F獲得焦點。查看全部
-
網頁定位導航特效主要是指在頁面內進行定位導航，適用于內容比較多的單頁面網頁查看全部
-
用原生JavaScript獲取href: 獲取全部網站的值。用#拆分 用jQuery的attr獲取href: 只含當前的值，不會獲取全部網站查看全部
-
用原生js編寫代碼時候需要注意瀏覽器的兼容性，特別是IE的查看全部
-
IE6不支持position:fixed，因此使用hack解決。 1、position的hack： * html #menu{ position: absolute; top: expression((e=document.documentElement.scrollTop ? e : document.body.scrollTop) + 100 + "px"); } 2、防止導航欄跳變： * html, * html body{ background-image: url(about:blank); background-attachment: fixed; }查看全部
舉報
0/150
提交
取消