滚动 CSS3 鼠标滚轮滚动插件jQuery Smoove.js

最新推荐文章于 2024-09-01 07:20:30 发布
原创 最新推荐文章于 2024-09-01 07:20:30 发布 · 3.2k 阅读 · 3 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#smoove-js #鼠标滚动插件 #css3鼠标滚动插件 #jquery插件 #smoove

jQuery Smoove一款非常强大鼠标滚轮滚动效果插件，jQuery Smoove很轻松便可实现鼠标滚动的时候页面的内容随着滚动展现绚丽的动感十足的css3动画效果。

jquery实例：jQuery Smoove使用方法

1、引入核心文件，请确保jQuery在smoove.js之前加载。

<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script src=
最低0.47元/天 解锁文章

200万优质内容无限畅学
jQuerySmoove一个简单的jQuery插件使用CSS3实现超级性感的滚动效果
08-07
jQuery Smoove一个简单的jQuery插件使用CSS3实现超级性感的滚动效果
前端项目-jquery-smoove.zip
09-03
描述中提到，"前端项目-jquery-smoove" 是一个简单的jQuery插件，设计用于实现"性感"的滚动效果，这里所谓的"性感"滚动可能指的是流畅、自然且具有视觉吸引力的滚动体验。通过使用CSS3的转换（transform）和过渡...
jQuery.smoove — jQuery和CSS3炫酷滚动页面内容元素动画特效插件
weixin_30436891的博客
09-14 306
插件介绍： 　　jQuery-smoove是一款jQuery和CSS3炫酷滚动页面内容元素动画特效插件。该内容元素动画插件在页面滚动到指定位置时，该位置的HTML元素会执行指定的CSS3动画特效，如旋转、翻转、放大缩小等动画特效。使用Smoove页面滚动元素动画特效插件可以很轻松的制作出各种华丽的CSS3动画效果。 基本用法 $('.smoove').smoove(options)...
制作jquery插件2-滚轮事件的插件
weixin_30361641的博客
02-28 101
在上一小节中我们使用jquery.fn.extend为jquery新增了两个新的方法，这一节来制作滚轮事件的插件。 1.准备好已经做好兼容的滚轮事件函数： function mousewheel(obj,fnWheel){ if (obj.addEventListener){ obj.addEventListener("DOMMouseScroll"...
smoove.js（网页中创建平滑滚动的动画效果）
wxd1959的博客
12-06 229
2. 创建HTML结构：在你的HTML文件中，为需要应用平滑滚动效果的元素添加相应的类名。- `moveY`: 设置垂直方向的滚动动画效果。可以是一个数字，表示滚动的距离（单位为像素），也可以是一个字符串，表示滚动的百分比（例如"50%"）。1. 引入Smooove.js文件：将Smooove.js文件下载到你的项目中，并在你的HTML文件中引入它。可以是一个数字，表示旋转的角度（单位为度），也可以是一个字符串，表示旋转的百分比。可以是一个数字，表示缩放的比例，也可以是一个字符串，表示缩放的百分比。
jquery 滚轮插件
Zson_bai的博客
04-21 244
https://www.cnblogs.com/lxpursue/p/3914230.html
jquery css3华丽滚动效果.zip
07-04
3. **jQuery Smoove插件**: 这是一个基于jQuery的插件，专门用于创建平滑的元素滚动动画。Smoove允许开发者轻松地实现元素在页面滚动时的淡入淡出、滑动或其他动态效果，极大地提升了网页的视觉吸引力。 4. **动画...
jQuery页面滚动元素展现隐藏动画插件
11-02
开发者可以利用jQuery的API和CSS3特性，结合滚动事件，创造出丰富多样的滚动动画效果，使网页在用户滚动时呈现动态变化，提升用户体验。在实际项目中，可以根据需求选择合适的动画效果，并优化性能，确保插件的稳定...
数字滚动插件（css3 只兼容高版本浏览器，供学习）
weixin_33828101的博客
04-27 245
2019独角兽企业重金招聘Python工程师标准>>> ...
js css3动画库,实用的纯JS和CSS3页面滚动动画库插件
weixin_35926197的博客
08-04 407
kissui.scrollanim是一款实用的纯JS和CSS3页面滚动动画库插件。通过该插件可以使元素进入浏览器视口的时候，展示指定的CSS3动画效果。安装可以通过bower来安装kissui.scrollanim插件。bower install kissui.scrollanim使用方法在页面中引入scrollanim.css和scrollanim.js文件。HTML结构为你需要制作CSS3动画...
jQuery 鼠标滚轮插件 mousewheel
04-27
1.使用方法很简单，仅仅把mousewheel绑定到指定元素上。示例代码如下： // using on $(&#39;#my_elem&#39;).on(&#39;mousewheel&#39;, function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); }); // using the event helper $(&#39;#my_elem&#39;).mousewheel(function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); }); 2.它提供了两个很有帮助事件mousewheel和unmousewheel来封装了滚轮的事件：使用方法如下： //绑定mousewheel事件 $(&#39;#my_elem&#39;).on(&#39;mousewheel&#39;, function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); }); //解除mousewheel事件 $(&#39;#my_elem&#39;).unmousewheel(fn) 3.阻止事件冒泡，如果只想在某个元素上捕捉事件，而不想冒泡到document上，这样浏览器的滚动条就不会发生滚动了。事件代码如下： //阻止冒泡 $(&#39;#my_elem&#39;).on(&#39;mousewheel&#39;, function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); return false; }); 4.获取滚动的方向,示例代码如下： if (delta > 0) o += &#39; up (&#39; + delta + &#39;)&#39;; else if (delta 0) o += &#39; north (&#39; + event.deltaY + &#39;)&#39;; else if (event.deltaY 0) o += &#39; east (&#39; + event.deltaX + &#39;)&#39;; else if (event.deltaX < 0) o += &#39; west (&#39; + event.deltaX + &#39;)&#39;; 5.可以通过event.deltaFactor获取滚动的距离，代码如下： $(&#39;#my_elem&#39;).on(&#39;mousewheel&#39;, function(event) { console.log(event.deltaFactor); return false; });
jquery滚轮插件代码
03-24
jquery滚轮插件代码，兼容所有版本 IEjquery滚轮插件代码
js css3页面滚动动画效果代码.zip
07-04
js css3页面滚动动画效果代码是一款CSS3全屏滚动插件效果。
css3页面滚动div元素动画特效.zip
07-03
css3页面滚动div元素动画特效是一款基于aos.js插件实现的页面滚动元素动画。
smoove:另一个CSS框架
05-23
柔顺 一个12列，类似于BEMCSS框架，可用于小型到大型项目。 项目现场 变更日志 0.1.5.1 修复了一些JS错误。 现在在Azure上进行持续部署。 没有更多的gh页bs。 0.1.5 添加了面包屑。 0.1.4.1 Toggler现在可以与兄弟姐妹而不是相邻元素一起使用。 0.1.4 添加了对模式，下拉列表和选项卡的JS支持。 0.1.3 添加了smoove_ui.js。 0.1.2 添加了侧边栏。 0.1.1 添加了标题。 0.1.0 初始签到。 已知的问题 打开下拉菜单后，单击其他下拉菜单激活器应关闭当前打开的下拉菜单并打开新单击的下拉菜单。 当前，当下拉列表打开时，单击其他下拉列表只是关闭打开的下拉列表，而不激活新单击的下拉列表。
鼠标滚动,导航置顶.纯css3的position: sticky;
weixin_30544657的博客
05-21 289
position: sticky; 这东西来自css3,并且瞬间就完成了置顶的效果. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> ...
探索jQuery Smoove：为您的网页增添华丽滚动效果
gitblog_00567的博客
08-30 817
探索jQuery Smoove：为您的网页增添华丽滚动效果 在当今的网页设计领域，用户体验的重要性日益凸显。一个流畅、动态的界面不仅能够吸引用户的注意力，还能提升整体的交互感受。今天，我们将深入探讨一个能够为您的网页带来华丽CSS3滚动效果的开源项目——jQuery Smoove。 项目介绍 jQuery Smoove是一个轻量级的jQuery插件，它能够让您的网页内容在用户滚动页面时，以流畅的C...
html 5中的鼠标滚动事件
jackyrongvip的专栏
07-01 3202
在web中，要是鼠标的滚动轴的事件能利用起来，那是十分好的事情。比如鼠标轮轴滚动时，图片可以自由放大和缩小。   很多浏览器中，都支持mousewheel事件，并且有wheelDelta 属性， 支持正数的值话向上鼓动，负数的话向下滚动，但可惜firfox中，对这个的规定 是刚好相反的，正数的话向下滚动，负数的向上滚动，并且实现的事件是 DOMMouseScroll。    下面例子说明下如何用这
jQuery Smoove 开源项目安装与使用教程
最新发布
gitblog_00376的博客
09-01 1028
jQuery Smoove 开源项目安装与使用教程 1. 项目目录结构及介绍 jQuery Smoove 是一个用于增强网页滚动体验的jQuery插件，利用CSS3过渡效果和变换，让内容以平滑且吸引人的方式进入视野。以下是基于此项目可能的一个典型目录结构示例： jquery-smoove/ │ ├── dist/ # 生产环境使用的压缩版本文件夹 │ ...
jQuery-smoove插件：实现CSS3性感滚动效果
3. **jquery-smoove**: 这部分指示了项目的核心是一个名为“smoove”的jQuery插件。插件是增强库功能的代码块，可以通过添加新的方法或功能来扩展原有库。 #### 描述解析 1. **一个简单的jquery插件**: 插件是能够...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值