`
hjl416148489
  • 浏览: 22324 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

jQuery.nicescroll美化滚动条

阅读更多
jQuery滚动条插件兼容ie6+、手机、ipad。
首先我们在#content加入一定高度的内容。一定要出现滚动条,不然看不到效果。
<div id="content"> 
    <h2>我们的特色</h2> 
    <p>1、软件+人工精心仿制。3个工作日内完成仿制</p> 
    <p>2、文件归类。图片放在images文件夹,样式css,特效js,字体fonts</p> 
    <p>3、个人中心、需要登录等页面也可仿制</p> 
    <p>4、html完美格式化。</p> 
    ...... 
</div>

接着我们引入jQuery库和nicescroll插件:
<script type="text/javascript" src="jquery.js"></script>  
<script type="text/javascript" src="js/jquery.nicescroll.js"></script>

调用niceScroll 滚动条插件非常简单:
$('#content').niceScroll({ 
    cursorcolor: "#ccc",//#CC0071 光标颜色 
    cursoropacitymax: 1, //改变不透明度非常光标处于活动状态(scrollabar“可见”状态),范围从1到0 
    touchbehavior: false, //使光标拖动滚动像在台式电脑触摸设备 
    cursorwidth: "5px", //像素光标的宽度 
    cursorborder: "0", //     游标边框css定义 
    cursorborderradius: "5px",//以像素为光标边界半径 
    autohidemode: false //是否隐藏滚动条 
});

滚动条演示http://www.sucaihuo.com/js/125.html
分享到:
评论

相关推荐

    jquery.nicescroll美化滚动条插件鼠标滑过显示

    在这个例子中,`#your-element`是你希望应用美化滚动条的元素ID。你可以根据需求调整各个参数,以达到理想的视觉效果。 对于鼠标滑过显示的效果,`jQuery.nicescroll`默认就提供了这一特性。当鼠标进入元素时,滚动...

    jquery.nicescroll仿IOS滚动条美化插件.zip

    jQuery.nicescroll插件就是一款专门用于美化滚动条的工具,它能够帮助开发者创建出类似于iOS设备上的平滑、简洁的滚动效果,提升网站的整体视觉体验。 一、jQuery.nicescroll简介 jQuery.nicescroll是一款基于...

    jquery.nicescroll仿IOS滚动条美化插件

    jQuery.nicescroll 是一个强大的 JavaScript 插件,它提供了仿 iOS 风格的滚动条美化功能,为网站增添了一抹时尚与优雅。本篇文章将深入探讨 jQuery.nicescroll 的主要特性和使用方法。 **1. 仿 IOS 滚动条样式** ...

    jquery.nicescroll.rar

    jQuery.nicescroll 是一款功能强大的滚动条美化插件,它能够为网页中的滚动条赋予优雅、直观且可定制的外观,提升用户体验。这款插件广泛应用于现代网页设计中,尤其对于那些追求界面美观和交互效果的网站。 **一、...

    jQuery.nicescroll

    接着,通过jQuery选择器找到需要美化滚动条的元素,并调用`.niceScroll()`方法进行初始化。可以传递一个配置对象,设置滚动条的颜色、宽度、背景等属性,以实现个性化定制。 总的来说,jQuery.nicescroll是一个强大...

    jQuery美化滚动条

    引入插件后,可以通过jQuery选择器找到需要美化滚动条的元素,并调用`.niceScroll()`方法进行初始化。同时,可以传递一个包含配置选项的对象,以定制滚动条的样式和行为。例如: ```javascript $("#your-element")....

    一款无滚动条左右拖拽的jquery.nicescroll插件.zip

    【标题】"一款无滚动条左右拖拽的jquery.nicescroll插件.zip"涉及的核心技术是jQuery和nicescroll插件。jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互。而nicescroll则是...

    jquery.nicescroll-3.7.6.tar.gz

    1. 博客和文章页面:在长篇文章中,美化滚动条可以提升阅读体验。 2. 图片画廊:在图片展示区域,优雅的滚动条能够与界面风格更好地融合。 3. 视频播放器:在视频控制面板,NiceScroll 可以使滚动操作更加平滑。 ...

    jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法

    通过使用jquery.nicescroll插件,我们可以隐藏默认的滚动条,并实现一个可定制的、美观的滚动条效果。 在使用jquery.nicescroll时,我们需要先引入jQuery库和jquery.nicescroll插件。在文档的部分,我们已经通过...

    jquery滚动条美化插件

    总的来说,jQuery.nicescroll插件是一个强大且易用的解决方案,它为网页设计师和开发者提供了美化滚动条的便利,让滚动条成为网站设计中的一道亮丽风景线。通过灵活的配置和丰富的API,你可以创造出符合自己项目需求...

    jQuery滚动条美化插件nicescroll简单用法示例

    使用jquery.nicescroll来美化滚动条吧(so easy!!): 首先:下载jquery.nicescroll.js。百度一下哦!!!(或者像本例所示直接使用CDN地址) 然后引入jquery.nicescroll.js,并且使用: &lt;!DOCTYPE html&gt; &lt;...

    jquery滚动条美化插件.rar

    "jQuery滚动条美化插件"正是一款专注于改善滚动条外观的工具,它允许开发者通过简单的配置,使网页的默认滚动条变得更为优雅和符合网站主题。 该插件基于JavaScript库jQuery构建,jQuery是一个广泛使用的开源...

    jQuery中Nicescroll滚动条插件的用法

    Nicescroll是一款强大的jQuery滚动条插件,它提供了一种优雅的方式来替代浏览器默认的滚动条,使得滚动体验更加美观和个性化。Nicescroll的特点在于它的跨浏览器兼容性,支持IE6+以及各种现代浏览器,并且不需要额外...

    jQuery仿IOS滚动插件Nicescroll3.zip

    这款插件利用JavaScript库jQuery,实现了平滑、流畅的滚动效果,并且支持全屏切换和滚动条美化功能,为网站增添了一丝高级感和移动设备般的交互体验。 **1. jQuery与Nicescroll3的关系** jQuery是一个广泛使用的...

    jquery 滚动条整屏翻页

    2. **nicescroll.js**: Nicescroll 是一个 jQuery 插件,提供了美化滚动条的功能,可以让滚动条更加美观,符合整屏翻页的视觉效果。 3. **jquery.mousewheel.js**: 这个插件扩展了 jQuery,添加了对鼠标滚轮事件的...

    jQuery仿IOS滚动插件Nicescroll3特效代码

    其中,`jQuery.nicescroll`是一款非常受欢迎的滚动条美化插件,特别是它的`Nicescroll3`版本,更是以其仿iOS的滚动效果,深受前端开发者喜爱。这个插件不仅能够提升网站的视觉吸引力,还能提供与iOS设备类似的交互...

    滚动条插件

    除了 jQuery MCustomScrollbar,还有其他类似插件,如 Perfect Scrollbar、SimpleBar、Nicescroll 等,它们同样提供滚动条样式的定制,各有其特色和适用场景。选择哪个插件取决于你的具体需求,如性能、兼容性、...

Global site tag (gtag.js) - Google Analytics