博客

  • jquery attr()、prop()区别和应用

    表单 input checkbox radio

    jquery attr()、prop()区别和属性支持

    attr_prop

     

  • pagepiling.js全屏单页滚动

    pagepiling.js全屏单页滚动,跟fullpage插件类型兼容性在IE8下可以使用。

    http://pan.baidu.com/s/1c0lNHhI

  • marquee.js – jQuery 多功能无缝滚动插件

    图片滚动

    demo

    这个基于 jQuery 的多功能无缝滚动插件是我在几个月之前就写好的,只是碍于时间没有把插件公开出来,近段时间,这个插件陆续在公司的几个项目中得到应用,尝试效果还算不错,期间也修复了一些 bug,自我感觉这个插件在功能上已经比较成熟,可以在大多数的无缝滚动文字或者轮播图上一展身手,现在就分享给大家。

    首先,来说明一下,这个“多功能”无缝滚动插件,到底怎么“多功能”?marquee.js 插件一共提供了 19 个可选的配置参数,是我所能想到的一般无缝滚动所可能涉及到的多样化了。

    <div id="wrap3" class="wrap">
     <ul>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
      <li>7</li>
      <li>8</li>
      <li>9</li>
     </ul>
    </div>

     

    $(function() {
      $('#wrap3').marquee({
       auto: true,
       interval: 3000,
       speed: 500,
       showNum: 5,
       stepLen: 5
      });
     })
    auto: true // 是否自动滚动
    interval: 3000 // 间隔时间(毫秒)
    direction: 'forward' // 向前 - forward / 向后 - backward
    speed: 500 // 移动速度(毫秒)
    showNum: 1 // 显示个数
    stepLen: 1 // 每次滚动步长
    type: 'horizontal' // 水平滚动 - horizontal / 垂直滚动 - vertical
    prevElement: null // 上一组按钮元素
    prevBefore: function() {} // 上一组移动前回调
    prevAfter: function() {} // 上一组移动后回调
    nextElement: null // 下一组按钮元素
    nextBefore: function() {} // 下一组移动前回调
    nextAfter: function() {} // 下一组移动后回调
    pauseElement: null // 暂停按钮元素
    pauseBefore: function() {} // 暂停前回调
    pauseAfter: function() {} // 暂停后回调
    resumeElement: null // 继续按钮元素
    resumeBefore: function() {} // 继续前回调
    resumeAfter: function() {} // 继续后回调

    http://wange.im/marquee-js-jquery-scroll-plugin.html

  • ion.rangeSlider.min.js滑块

    js 滑块 刻度条

    rangeSlider

    官网:http://ionden.com/a/plugins/ion.rangeSlider/demo_interactions.html

    设置

    选项 数据的Attr 默认 类型 描述
    type data-type single 选择滑块类型,可以是single– 对于一个手柄,或double对于两个手柄
    min data-min 10 设置滑块最小值
    max data-max 100 设置滑块最大值
    from data-from min 设置左手柄的起始位置(或单手柄)
    to data-to max 设置右手柄的起始位置
    step data-step 1 设置滑块步骤。总是> 0.可能是分数
    min_interval data-min-interval - 设置滑块之间的最小间隔。仅适用于双人
    max_interval data-max-interval - 设置滑块之间的最小最大值。仅适用于双人
    drag_interval data-drag-interval false 布尔 允许用户拖动整个范围。仅适用于双人
    values data-values [] 排列 设置您自己的滑块值数组。它们可以是数字或字符串。如果设置了values数组,则不能再更改min,max和step param
    from_fixed data-from-fixed false 布尔 固定左(或单)手柄的位置
    from_min data-from-min min 设置左(或单)手柄的最小限制
    from_max data-from-max max 设置左(或单)手柄的最大限制
    from_shadow data-from-shadow false 布尔 突出显示左手柄的限制
    to_fixed data-to-fixed false 布尔 固定右手柄的位置
    to_min data-to-min min 设置右手柄的最小限制
    to_max data-to-max max 设置右手柄的最大限制
    to_shadow data-to-shadow false 布尔 突出显示正确的手柄
    prettify_enabled data-prettify-enabled true 布尔 提高长数字的可读性:10000000→10 000 000
    prettify_separator data-prettify-separator 为长数字设置自己的分隔符:10000000→10,000,000等。
    prettify - null 功能 设置自己的美化功能。可以是任何东西。例如,您可以将unix时间设置为滑块值,然后将它们转换为看起来很酷的日期
    force_edges data-force-edges false 布尔 滑块手柄和工具提示将始终位于其容器内
    keyboard data-keyboard true 布尔 激活键盘控件。向左移动:←,↓,A,S。向右移动:→,↑,W,D。
    grid data-grid true 布尔 在滑块上方启用值网格
    grid_margin data-grid-margin true 布尔 设置左右网格间隙
    grid_num data-grid-num 4 网格单元数
    grid_snap data-grid-snap false 布尔 将网格捕捉到滑块步骤(步骤参数)。如果激活,则不使用grid_num。最大步数= 50
    hide_min_max data-hide-min-max false 布尔 隐藏最小最大标签
    hide_from_to data-hide-from-to false 布尔 隐藏标签
    prefix data-prefix 设置值的前缀。将在数字之前设置:** $ ** 100
    postfix data-postfix 设置值的后缀。将在数字后立即设置:100 k
    max_postfix data-max-postfix 特殊后缀,仅用于最大值。将在手柄到达最大右侧位置后显示。例如0 – 100+
    decorate_both data-decorate-both true 布尔 用于双重类型,仅在设置了前缀或后缀时使用。确定如何装饰接近的值。例如:$ 10k – $ 10万$ 10 – 100k
    values_separator data-decorate-both - 为关闭值设置您自己的分隔符。用于双重类型。默认值:10 – 100。或者您可以设置:10到100,10 + 100,10→100等。
    input_values_separator data-input-values-separator ; 输入值属性中的double值的分隔符。<input value="25;42">
    disable data-disable false 布尔 锁定滑块并使其处于非活动状态。输入也被禁用。形式看不见
    block data-blokc false 布尔 锁定滑块并使其处于非活动状态。输入未被禁用。可以发送表格
    extra_classes data-extra-classes 将额外的CSS类遍历到滑块容器
    scope - null 目的 回调范围。传递任何物体
    onStart - null 功能 回电话。在滑块启动时调用。获取所有滑块数据作为第一个属性
    onChange - null 功能 回电话。IS调用每个值的变化。获取所有滑块数据作为第一个属性
    onFinish - null 功能 回电话。在用户释放句柄时调用。获取所有滑块数据作为第一个属性
    onUpdate - null 功能 回电话。当滑块由外部方法修改被称为updatereset

     

    huakuai

    可兼容IE7+

    http://pan.baidu.com/s/1hqxQ67y