热门关键字:
jquery > jquery教程 > jquery教程 > jQuery滚动固定侧边栏元素插件Sticksy.js

jQuery滚动固定侧边栏元素插件Sticksy.js

474
作者:管理员
发布时间:2020/2/27 15:05:49
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=913

  简要教程

  Sticksy.js是一款jQuery滚动固定侧边栏元素插件。该插件可以在页面滚动时,将任意元素固定在页面的可视区域中,跟随页面一起滚动。

  使用方法

  安装

  npminstallsticksy--save

  yarnaddsticksy

  HTML结构

  <asideclass="sidebar">

  <!--Nonstickyelement-->

  <divclass="widget"></div>

  <!--Stickyelement-->

  <divclass="widgetis-sticky"></div>

  <!--Now,thenextelementsarestickyalso-->

  <divclass="widget"></div>

  <divclass="widget"></div>

  </aside>

  初始化插件

  varstickyElement=newSticksy('.widget.is-sticky');

  作为jQuery插件使用。

  varstickyElement=$('.widget.is-sticky').sticksy();

  API

  varinstance=newSticksy(target[,options]);

  //demo

  varstickyEl=newSticksy('.block.is-sticky',{

  topSpacing:60,//Specifythiswhenyouhaveafixedtoppanel

  listen:true,//ListenfortheDOMchangesinthecontainer

  });

  可用的配置参数如下:

  topSpacing:指定元素被固定时,距离页面顶部的距离。默认为0。

  listen:是否监听dom元素的变化。默认为false。





如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jQuery
友荐云推荐