javascript - stellar.js视差滚动插件中的showElement方法总是在元素一出现在视口就执行，能否改成元素到达视口中央才执行？-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

javascript - stellar.js视差滚动插件中的showElement方法总是在元素一出现在视口就执行，能否改成元素到达视口中央才执行？

天蓬老师 2017-04-10 15:18:56

[JavaScript讨论组]

586

这是stellar插件的中文文档，如乱码请将字符编码改成unicode

$().stellar({
  // 自定义元素如何出现和消失
  hideElement: function($elem) { $elem.hide(); },
  showElement: function($elem) { $elem.show(); }
})

stellar.js视差滚动插件中的showElement方法可以在元素出现的那一刻执行用户自定义的函数。
然而，这个方法总是在元素一出现在视口就执行，能否改成元素到达视口中央才执行？

天蓬老师

欢迎选择我的课程，让我们一起见证您的进步~~

全部回复(1)

ringa_lee2017-04-10 15:20:56 1楼

var rect=element.getBoundingClientRect用于获得页面中某个元素相对浏览器视窗的位置
根据你的需求判断rect.top是否在你期望的位置
如果是，就显示;否则继续等待

$().stellar({
  // 自定义元素如何出现和消失
  hideElement: function($elem) { 
    $elem.hide(); 
  },
  showElement: function($elem) { 
    var rect=$elem[0].element.getBoundingClientRect();
    if(rect.top<=你期望的位置){
        $elem.show();
    }
 }
});

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>