轩枫阁

首页 / Web前端 / CSS / jQuery方向感知动画-图片聚焦框

jQuery方向感知动画-图片聚焦框

前言

分享一段创意相册交互:透明层聚焦框跟随鼠标在相册的图片上移动,聚焦框跟随图片大小改变形状,利用CSS3实现渐变透明效果,大方美观。

效果预览

美图酷览http://www.xuanfengge.com/gallery/dudulun

1

实现简介

半透明框

利用CSS3的渐变+rgba的透明效果实现

因为是CSS3,不支持gradient和rgba效果的浏览器请自行做兼容处理

 

移动效果

利用jQuery的animate动画效果实现

206/470
208/470

相关阅读

文章评论

  • 帮你顶,人还是厚道点好

  • 窗口大小改变的时候,感觉还有点问题。

    • 被发现了。。。这写的很简单啊,可以加上对resize的时候做处理

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子