文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
滚动显示
滚动显示是一个 JQuery 插件,根据滚动的距离来执行回调函数。我们将展示很多的示例来告诉你怎么使用。
jQuery 插件初始化
var options = [
{selector: '.class', offset: 200, callback: customCallbackFunc } },
{selector: '.other-class', offset: 200, callback: function() {
customCallbackFunc();
} },
];
Materialize.scrollFire(options);
jQuery 插件选项
选项名称 | 描述 |
---|---|
Selector | 追踪元素的选择器。 |
Offset | 如果这是 0,当选择器的元素到达用户的窗口时这个回调被触发。 |
Callback | 执行一个回调函数当用户滚动到指定位置时。仅执行一次。 这个回调函数提供一个参数,这个参数关联到当前选择的元素。 |
滚动显示示例
慢慢的滚动,你会知道滚动显示能为你做什么。这个滚动显示的代码我们在这里使用的代码。
var options = [
{selector: '#staggered-test', offset: 50, callback: function(el) { Materialize.toast("This is our ScrollFire Demo!", 1500 ); } },
{selector: '#staggered-test', offset: 205, callback: function(el) { Materialize.toast("Please continue scrolling!", 1500 ); } },
{selector: '#staggered-test', offset: 400, callback: function(el) { Materialize.showStaggeredList($(el)); } },
{selector: '#image-test', offset: 500, callback: function(el) { Materialize.fadeInImage($(el)); } }
]; Materialize.scrollFire(options);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论