js阴影跟随插件realshaow.js

所属分类:UI-悬停

 4579  78  查看评论 (2)
js阴影跟随插件realshaow.js ie兼容9

首先引入 jQuery 框架及 Real Shadow 插件:

然后初始化

$(selector).realshadow(); // options are optional
$(selector).realshadow({
    followMouse: false,   // 默认为true
    pageX:       x,       // 光源 X 轴的坐标
    pageY:       y        // 光源 y 轴的坐标
    c: {                  // 阴影的颜色
        r: 1,             // red   channel for shadow
        g: 1,             // green channel for shadow
        b: 1,             // blue  channel for shadow
    }
});

相关插件参数这个插件拥有几个简单的选项可以帮助你自定义,如下:followMouse:缺省为false,指定阴影是否跟随鼠标移动变化pageX:用来产生阴影的光源x坐标 pageY:用来产生阴影的光源y坐标 c:阴影颜色定义,包括r, g, b如果你需要给不同的元素指定颜色,你可以使用如下方法:

<span rel="r"></span>
<span rel="g"></span>
<span rel="b"></span>
<span rel="rg"></span>
<span rel="gb"></span>
<span rel="br"></span>
<span rel="rgb"></span>

 以上代码中我们使用rel来定义对应元素的阴影颜色。

相关插件-悬停

基于Jquery的简单实用的图片悬浮效果

简单实用的图片悬浮效果如果要兼容ie8可将背景图作成png.
  悬停
 10093  87

60种css3鼠标悬停效果

一款使用的效果,数遍悬停会出现相应图片的简介
  悬停
 15098  384

JS超酷图片翻动展示效果

JS超酷图片翻动展示效果
  悬停
 13560  242

JQuery 鼠标悬停放射出炫幻效果

JQuery 鼠标悬停放射出炫幻效果 CSS 里面还带字体哦
  悬停
 9825  93

讨论这个项目(2)回答他人问题或分享插件使用方法奖励jQ币

    九尾狐的yi巴 0
    2018/1/7 12:11:18
    总督sir 0
    2017/11/21 21:10:01
取消回复