[问题] 关于卷轴高度的计算(附P币)

楼主: G4321 (小胖囉)   2019-03-22 15:03:14
就是滚轮往下滑的时候 SVG的线会跟着卷轴一起往下移动 会有往外延伸的感觉
codepen网址:
https://codepen.io/bearman123/pen/PLxMXw?editors=1010
原理我都懂 先让 strokeDasharray strokeDashoffset的数值跟SVG的长度一样 才能全
部遮蔽
之后要让卷轴的高度 去配合元素的高度一起连动
但我实在是有看没有懂 有没有高手可以帮忙解惑一下 是怎样的计算方式
$(window).scroll(function () {
var scrollPercentage = (document.documentElement.scrollTop + document.body.s
crollTop) / (document.documentElement.scrollHeight - document.documentElement.
clientHeight);
var drawLength = pathLength * scrollPercentage;
path.style.strokeDashoffset = pathLength + drawLength;
附上P币500元给第一个解惑的朋友 谢谢您
作者: pkro12345 (席龙)   2019-03-22 17:13:00
分母是整个网页的高度减目前浏览器的高度等于全部可滚动的高度分子两个都是已滚动的高度 其中一个为0 纯粹是支援某些浏览器的差异所以滑越多越接近1
作者: shter (飞梭之影)   2019-03-22 22:14:00
我看了一下,请问你是想要做类似我下面这种 DEMO 效果?https://melixyen.github.io/fmy/rong/dw.html如果是的话,那是用 position:absolute 配合 left top 值去改动目前看的座标点,让画面 focus 在 path 画到的位置

Links booklink

Contact Us: admin [ a t ] ucptt.com