1

我有一个流体页面，它是一个实心图像，设置为根据视口高度进行缩放（我使用一个 jquery 库，它也将页面的宽度转换为页面的高度，verticalscroll.js）

css设置图像是

.graphic{
    z-index: 250;
    top:0px;
    width: calc(102vh * 16.77);
    height: 102vh;
    margin-left:-20px;
    background: url(../images/bigguy.svg) no-repeat;
    background-size: 1739vh;
    background-position: 0px;
}

我试图制作一个滚动 x 百分比的按钮，因为图像是时间线，并且图像上的事件最多滚动 %（例如，1950 始终可见滚动页面的 8%）

这是我用来移动（例如）到 click 函数内的 .08% 滚动的数学 - 但它的滚动不够

    var scrolling = theHeight * 1.08;
    $('html,body').animate({scrollTop: scrolling}, 800);

而不是滚动到 0.08，它只滚动到 0.07

js fiddle - https://jsfiddle.net/schweigert85/boe3kma4/4/（仅适用于 chrome 由于背景大小为 svg）

4

0 回答 0