javascript - 怎么讓頁(yè)面中固定定位的側(cè)邊欄的位置隨著滾動(dòng)條動(dòng)態(tài)增加呢?
問(wèn)題描述
需求是這樣的,一開(kāi)始頁(yè)面的側(cè)邊欄是固定在頁(yè)面的某一位置(如:right:0;bottom:0),隨著滾動(dòng)條的滾動(dòng),為了防止側(cè)邊欄折疊頁(yè)腳部分(參考下圖),到一定位置,bottom的值隨身滾動(dòng)條的增加而增加,效果類似起點(diǎn)中文網(wǎng)的效果,代碼如下,求大神,我的bottom只增加一個(gè)就不動(dòng)了!代碼如下:
//滾動(dòng)條監(jiān)聽(tīng)事件$(window).scroll(function () { var sTop = $(document).scrollTop(); var Bottom = 100;//設(shè)置底部距離 if (sTop >= 1738) {Bottom++;//不斷增加$('.main .main_p').css('bottom',Bottom);//設(shè)置固定側(cè)邊框位置 }else{$('.main .main_p').css('bottom',0); }})
起點(diǎn)中文網(wǎng)的具體效果展示:http://read.qidian.com/chapte...
問(wèn)題解答
回答1:不必不斷增加,很浪費(fèi)資源。用 fixed 定位,判斷到底了之后換 absolute 定位或其它方式定位到底部。
回答2:看看這樣行不行. https://jsfiddle.net/eyvxw3wc/
相關(guān)文章:
1. mysql - linux連接數(shù)據(jù)庫(kù)報(bào)錯(cuò)2. javascript - 有適合開(kāi)發(fā)手機(jī)端Html5網(wǎng)頁(yè)小游戲的前端框架嗎?3. python - flask報(bào)錯(cuò)ValueError: invalid key ’nicknickname’4. angular.js - 學(xué)習(xí)ui-router遇到的問(wèn)題5. MYSQL 根據(jù)兩個(gè)字段值查詢 但兩個(gè)值的位置可能是互換的,這個(gè)怎么查?6. php - MySQL數(shù)據(jù)庫(kù)設(shè)計(jì),獲取點(diǎn)贊的人數(shù)7. css - 如何選擇字體?8. mysql - 這種分級(jí)一對(duì)多,且分級(jí)不平衡的模型該怎么設(shè)計(jì)表?9. MySQL中的enum類型有什么優(yōu)點(diǎn)?10. java - 線上應(yīng)用,如果數(shù)據(jù)庫(kù)操作失敗的話應(yīng)該如何處理?
