1.想實(shí)現(xiàn)https://kddi-hikari.com/simul... 該鏈接中左邊sidebar在滾動(dòng)條下拉到一定位置的時(shí)候固定在頂部。實(shí)現(xiàn)思路:position:fixed ;top:0;最便捷的實(shí)現(xiàn)方式,我也實(shí)現(xiàn)了,但是我查看了網(wǎng)站的源碼是通過 position:relative; 監(jiān)聽scroll事件的scrollTop值top累加實(shí)現(xiàn)的,于是自己想嘗試一下,但是發(fā)現(xiàn)實(shí)現(xiàn)的效果一直會(huì)抖動(dòng),沒辦法平滑的定位在頂部。2.效果還原<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><script src='https://cdn.bootcss.com/jquery/3.2.1/jquery.js'></script><style> body{height: 2002px;}</style></head><body><div style="position: absolute;width: 100px;height: 100px;background-color: orange" id="test"><script>var test = $('#test');$(window).on('scroll',function(){var bodyScroll = document.documentElement.scrollTop ;bodyScroll = $(window).scrollTop();//bodyScroll = parseInt(bodyScroll);test.css("top",bodyScroll+100+'px')})</script></body></html>這段代碼就可以看到不能平滑定位的效果,找了兩天原因,實(shí)在無從下手,還請(qǐng)?zhí)峁┧悸贰?
scrollTop定位div元素抖動(dòng)問題
30秒到達(dá)戰(zhàn)場
2019-02-27 13:11:54