投稿 搜索

热搜词

热门文章

当前位置: 站长天下 / 界面UI滚动 / sticky-js固定元素代码插件可实现图片滚动固定
sticky-js固定元素代码插件可实现图片滚动固定
标签:

插件介绍

    sticky-js是一款js固定元素插件。sticky-js插件可以使页面DOM元素固定在某个位置,不随页面的滚动而滚动。

    浏览器兼容性

    浏览器兼容性
    时间:2018-06-27
    阅读:

sticky-js固定元素代码插件可实现图片滚动固定

简要教程

sticky-js是一款js固定元素插件。sticky-js插件可以使页面DOM元素固定在某个位置,不随页面的滚动而滚动。

安装
可以通过npm或bower来安装sticky-js插件。

npm install sticky-js
bower install sticky.js

使用方法
在页面中引入sticky.min.js文件。

<script src="sticky.min.js"></script>

HTML结构
例如,要让一个<div>元素固定在页面上。

<div class="selector">固定元素</div>

初始化插件
然后通过下面的方法来初始化该js固定元素插件。

var sticky = new Sticky('.selector');

语法为:

new Sticky([selector:string], [global options:object])

方法
sticky-js插件的可用方法有:
当父容器的高度改变时,更新sticky。

var sticky = new Sticky('.sticky');
// and when parent change height..
sticky.update();

销毁sticky元素。

var sticky = new Sticky('.sticky');
sticky.destroy();