jquery滚动插件,移动端滚动条插件

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

Jquery.nicescroll()插件：页面初始化滚动条不显示问题

链接： jquery的niceScroll没显示滚动条 - 小白小菜 - 博客园

本地数据使用niceScroll插件没有出现上述问题，首次进入页面可以正常显示出来。但是当使用滚动条的标签有ajax请求的数据填充时，就会出现页面刷新后不显示滚动条，必须将页面缩放才能正常展示。

将$(selector).niceScroll()放在ajax返回成功的函数里，即在ajax完成时填充数据完成后，在给标签绑定滚动条。

为使用户体验好，可以在ajax数据填充后延时1s再绑定滚动条。

$.ajax({

type: 'GET',

.........

success: function(data){

data数据逻辑处理...

$(document).ready(function(){

setTimeout(function(){ $(selector).niceScroll(); } ,1000);

});

}

});

相关问答

Q1: 40款经典前端特效插件---分享

1.flavr—超级漂亮的jQuery扁平弹出对话框

2.轻量级触摸响应滑块插件JQuery lightSlider

3.带37种3D动画特效的跨浏览器CSS3动画框架

4.jquery整屏滚动插件Scrollify

5.jquery旋转木马插件SLICK

6.jquery文字动画插件LetterFX

7.jquery文本翻转插件Wodry.js

8.jquery通知插件toastr

9.jQuery滚动执行动画插件FadeThis

10.jquery表单验证插件Bootstrap Validator

11.jCountdown倒计时插件jQuery

12.iCheck不一样的checkbok

13.Owl Carousel强大的响应式jQuery焦点图轮播插件

14.magic-带64种动画效果的CSS3动画库

15.jQuery实时搜索插件-HideSeek

16.bootstrap modal对话框

17.一款模拟CSS3动画的js插件-move.js

18.可替代CSS3 transition和transform的jQuery插件

19.基于bootstrap的jQuery多功能模态对话框插件

20.带CSS3过渡效果的js模态窗口插件

21.支持移动触摸设备的简洁js幻灯片插件

22.jQuery轻量级响应式扁平风格tabs选项卡插件

23.jQuery轻量级响应式Tooltip插件

24.jQuery简单且功能强大的图片剪裁插件

25.带CSS3动画过渡效果的jQuery模态窗口插件

26.中国省市区地址三级联动jQuery插件

27.移动端优先且支持jQuery和Zepto的模态对话框插件

28.jQuery简单实用的tooltip插件

29.带CSS3过渡动画效果的jQuery Tabs选项卡插件

30.x0popup-纯js弹出对话框插件

31.WOW.js-元素在页面滚动时展示CSS3动画JS插件

32.Windows8样式的消息提示框jQuery插件

33.jQuery星级评分插件

34.fsBanner-实用的网站响应式Banner手风琴插件

35.draggabilly-功能强大的拖动拖拽元素插件

36.验证插件vali.js

37.响应式jQuery图片放大镜插件magnificent.js

38.可快速生成各种阴影效果的jQuery插件

39.基于jquery的非常逼真的全屏下雪效果

40.纯文本Loading加载指示器特效

Q2: jquery插件怎样使用和修改?

jQuery插件要使用它的话通常插件中都有demo或者api可以查阅\x0d\x0a通常jQuery插件为了减小体积会发布两个版本 XXX.js和XXX.min.js\x0d\x0a\x0d\x0a如果你要修改插件需要使用XXX.js文件\x0d\x0a\x0d\x0a首先你要知道它怎么用,先有一个可用的demo(没有demo就自己写一个),然后用webkit内核或firefox进行断点查看,这主要是为了找插件入口点,当然你也可以直接查看js代码这需要一定的底子\x0d\x0a最后就是慢慢查看他的代码的实现功能了,先得看懂他是怎么实现的,然后你才会知道怎么改.\x0d\x0a\x0d\x0ajQuery插件我也写的不少像模拟alert/confirm/prompt 错误信息提示框模拟弹出窗体无缝marquee滚动分页控件拖拽控件等等\x0d\x0a\x0d\x0ajQuery插件的框架写法通常是\x0d\x0a\x0d\x0a(function($){\x0d\x0a $.fn.extend({\x0d\x0a fnKey:function(){}\x0d\x0a })\x0d\x0a //或者\x0d\x0a $.fn.fnKey=function(){}\x0d\x0a})(jQuery)\x0d\x0a\x0d\x0a上面的两种写法的调用方式是\x0d\x0a\x0d\x0a$("XXX").fnKey()进行调用的\x0d\x0a\x0d\x0a还有一种写法:\x0d\x0avar fnClass = function(){\x0d\x0a this.fnKey=function(){\x0d\x0a }\x0d\x0a this.props="";\x0d\x0a}\x0d\x0a\x0d\x0a这种写法是的调用方式是\x0d\x0afnClass obj = new fnClass();\x0d\x0aobj.fnKey();\x0d\x0a\x0d\x0a第二种写法是js的面向对象编程得自己慢慢的理解哈

Q3: jquery插件infinite scroll怎么用

无限滚动插件，给个demo，参考一下：

%@ page language="java" contentType="text/html; charset=utf-8"

pageEncoding="utf-8"%

!DOCTYPE html

html

head

meta charset="utf-8"

title无限翻页效果/title

script src="css/infinite-scroll/jquery-1.6.4.js"/script

script src="css/infinite-scroll/jquery.infinitescroll.js"/script

script src="css/infinite-scroll/test/debug.js"/script