`

jQuery Portamento 滑动定位

阅读更多
  • 版本:
  • jQuery v1.3.2+
  • jQuery Portamento v1.1.1
  • 注意事项:
  • 在不支持position:fixed的浏览器里效果不是很好(例如 IE6、iOS4),可以在参数中设置disableWorkaround: true来禁止对这类浏览器的支持;
  • 需将 portamento.js 放在</head>之后</body>之前,否则有可能会报错:Cannot call method 'replace' of undefined
  • github地址

在线实例

实例预览 no limit 基础示例

实例预览 No workaround 不支持旧的浏览器

实例预览 Bigger gap 设置边距

实例预览 Absolute with bottom limit 在绝对定位布局中设置父容器

实例预览 Floated with bottom limit 在浮动布局中设置父容器

使用方法

载入 JavaScript 文件

  1. <script src="jquery.js"></script> 
  2. <script src="jquery.portamento.js"></script> 
复制

CSS 样式

  1. /* 默认时的样式 */ 
  2. #sidebar{} 
  3.  
  4. /* 加载 Portamento 成功后的样式 */ 
  5. #portamento_container{position:relative;z-index:99;} 
  6. #portamento_container #sidebar{} 
  7.  
  8. /* 滑动时的样式 */ 
  9. #portamento_container #sidebar.fixed{position:fixed;} 
复制

DOM 结构

  1. <body> 
  2.   <div>正常布局或内容</div> 
  3.   <div id="sidebar">要滑动定位的元素</div> 
  4. </body> 
复制

调用 Portamento

  1. $('#sidebar').portamento({ 
  2.   gap: 0, 
  3.   disableWorkaround: true 
  4. }); 
复制

参数说明

名称 默认值 说明
wrapper $('body') 父容器
gap 10 与窗口顶部的边距 (px)
disableWorkaround false 不支持旧的浏览器。

 

1
0
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    jQuery插件实现DIV浮动在页面固定位置中

    标题中的“jQuery插件实现DIV浮动在页面固定位置中”是指使用JavaScript库jQuery来创建一个功能,使得HTML中的元素能保持在用户滚动页面时的特定位置,通常这种效果被称为“固定定位”或者“吸附效果”。这个功能常...

    phantomjs下载

    phantomjs web driver, 无界面自动化driver。PhantomJS

    Novation诺维逊 V-Station 用户说明书.pdf

    9. Portamento:提供了指数和线性斜坡两种 Portamento 模式,满足不同的音乐需求。 10. Unison 模式:能够将八个音色合成为一个音色,创造出浓郁的音场效果。 11. Arpeggiator:提供了可变的模式、范围和门控时间,...

    arduino_monotron:Arduino的代码,可通过MIDI控制Korg Monotron

    arduino_monotron 该代码是针对Arduino的,应该通过MIDI控制Korg Monotron 完毕: CV音调跟踪, 过滤器控制伪指数ADSR, Legato,Portamento和普通模式, 弯音adr罐的对数缩放, LFO锯,坡道,方形,三角形基于波表...

    我做的电子琴,21个音,一般歌曲基本上都能够弹奏、

    其次,电子琴的演奏方式多样,除了基本的按键演奏,还可能包含触后(Aftertouch)和滑音(Portamento)等功能,增加了表现力。触后是指按住键后对键的压力变化,可改变声音的效果;滑音则允许音符之间平滑过渡,实现...

    Borg.com Midi Specification

    - **Portamento Time**:滑音时间,控制音符之间的过渡。 - **Data Entry**:数据输入,用于设置特定参数。 - **Volume**:音量控制器。 - **Balance**:平衡控制器,用于调整左右声道的平衡。 - **Pan ...

    电子琴VHDL设计方案

    例如,颤音(Vibrato)、滑音(Portamento)等效果可以通过控制振荡器的频率在一定范围内波动来实现。VHDL程序可以设定相应的定时器和控制逻辑来实现这些动态效果。 在VHDL设计完成后,通常会通过仿真工具进行测试...

    liangzhu.rar_liangzhu_电子琴

    4. **演奏控制**:电子琴应具备多种演奏控制,如触后(Aftertouch)、滑音(Portamento)、颤音(Vibrato)等,以增加表现力。对于《梁祝》这样情感丰富的作品,这些功能的实现尤为重要。 5. **用户界面**:良好的...

    钢琴演奏表情术语一览表.rar

    "portamento"是弦乐器上的滑音效果,在钢琴上可能通过连音和断音的混合来模拟。 5. **表情术语**:“dolce”意味着甜美,要求温柔而深情地演奏;"grazioso"表示优雅,要求带有柔和的美感;"con espressione"提示...

    创建游戏音乐和声效 针对索尼爱立信手机

    - **针对Java ME游戏的MIDI特效**:通过巧妙地使用MIDI特效,如滑音(Portamento)、颤音(Vibrato)等,可以使音乐更具表现力和感染力。 - **案例**:本文档中提到了一个具体的案例——为游戏Sort'em创作音乐的过程...

Global site tag (gtag.js) - Google Analytics