javascript - 请问如何写，当滚动条滚动到一定位置，内容从左到右运动？

问题描述

问 题

用原生js如何实现的。比如是这个网站的效果

非推广，采纳完毕删除网址

解决方案

你问的是如何检测滚动位置，还是检测完之后的运动？
检测位置可以用 jquery 的 offset, scrollTop 之类方法检测。
原生的话就自己写个，

function isWindow( obj ) {
    return obj != null && obj === obj.window;
}
function getWindow( elem ) {
    return isWindow( elem ) ? elem : elem.nodeType === 9 && elem.defaultView;
}
function offset( elem ) {

    var docElem, win,
        box = { top: 0, left: 0 },
        doc = elem && elem.ownerDocument;

    docElem = doc.documentElement;

    if ( typeof elem.getBoundingClientRect !== typeof undefined ) {
        box = elem.getBoundingClientRect();
    }
    win = getWindow( doc );
    return {
        top: box.top + win.pageYOffset - docElem.clientTop,
        left: box.left + win.pageXOffset - docElem.clientLeft
    };
};

来源 https://stackoverflow.com/que...

至于之后向左运动，要原生的就得自己写，总的来说就是 position， right两个 css 值的变化。另外还可以用 css 定义动画，然后 javascript 动态加上 class 名即可，同样要 pure 就得自己写：

function addMyClass() {
  var classString = this.className; // returns the string of all the classes for myDiv
  var newClass = classString.concat(" main__section"); // Adds the class "main__section" to the string (notice the leading space)
  this.className = newClass; // sets className to the new string
}

来源 https://stackoverflow.com/que...

这篇关于javascript - 请问如何写，当滚动条滚动到一定位置，内容从左到右运动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！