下面通过一段JQuery代码实现鼠标滚轮滑动到页面节点的详细介绍，并通过展示效果图展示给大家。

基于jQuery鼠标滚轮滑动到页面节点部分。这是一款基于jQuery CSS3实现的使用鼠标滚轮或者手势滑动到页面节点部分特效。效果图如下：

实现的代码。

超文本标记语言代码：

section class='面板主页'数据-section-name=' home ' div class=' inner '标头h1/h1 p类=“标语”适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗brbr .不支持IE8及以下浏览器brbr/p/标题div style=' text-藻酸盐藻酸盐： center margin :10 px auto ' script src=' http :/js/ad _ js/BD _ 76090。js ' type=' text/JavaScript '/script/div br/a href=' # overview ' class=' scroll '滑动鼠标滚轮/a/div/section section class=' panel overview ' data-section-name=' overview ' div class=' inner ' H2基本使用/h2 p需要引入jQuery 1.6以及缓冲动画插件jquery。放松。JSP/p pre！doctype html html头脚本$(function(){ $).scrollify({ section : ' section '，})；});/script/head body section/section/section/body/html/pre/div/section section class=' panel configuration ' data-section-name=' configuration ' div class=' inner ' H2配置/h2 pre $ .scrollify({ section : ' section '，sectionName : 'section-name '，easing: ' easeOutExpo '，scrollSpeed: 1100，偏移量： 0，scrollbars: true，before:function() {}，before : function(){ })；/pre/div/section section class=' panel options ' data-section-name=' options ' div class=' inner ' H2选项设置/h2 dl dtsection/dt dd节点部分选择器/dd dtsectionName/dt dd每一个部分节点对应的数据属性/DDdt .宽松dt/DD定义缓冲动画/dd dtoffset/dt dd定义每个色彩象征式互动节点的偏移量滚动条是否显示滚动条/dd dtbefore/dt dd回调函数，滚动开始前触发/dd dtafter/dt dd回调函数，滚动完成后触发/DD/dl/div/section section class=' panel methods ' data-section-name=' methods ' div class=' inner ' H2方法/h2 p滑动到指定的节点/p pre $ .scrollify('move '，' # name ')；/pre div style=' text-藻酸盐藻酸盐： center margin :10 px auto ' script src=' http :/js/ad _ js/BD _ 76090。js ' type=' text/JavaScript '/script/div br//div/section js代码：

$(function () { $(').面板')。css({ 'height': $(window)).height()})；定义变量计时器；$(窗口)。resize(function () { clearTimeout(计时器));定时器=setTimeout(函数(){ $(')。面板')。css({ 'height': $(window)).height()})；}, 40);});$.滚动({ section: ' .panel ' })；$('.滚动')。单击（函数(e){ e . prevent default()；$.scrollify('move '，$(this).attr(' href ')；});});以上代码就是应用JQuery实现鼠标滚轮滑动到页面节点的全部内容，希望对大家在今后的项目过程中有所帮助。