资讯频道 → Web前端
阅读更多

10顶
0踩

Web前端

原创新闻 10 个基于 jQuery/CSS3 的图片特效

2013-06-17 10:25 by 见习编辑 html5_dev 评论(3) 有15648人浏览
jquery css 图片特效 Javascript

声明：ITeye资讯文章的版权属于ITeye网站所有，严禁任何网站转载本文，否则必将追究法律责任！

jQuery作为理想的开源Javascript开发库，已经被广大前端开发者所接受和使用，由jQuery编写的图片插件也数不胜数。CSS3是最近几年刚兴起的新技术，CSS3的应用，可以让图片拥有非常绚丽的特效，无论在视觉上还是在使用上，你一定会喜欢这些图片特效素材。

1、jQuery iNav水平滚动菜画插件

jQuery iNav水平滚动菜画插件，jQuery iNav是一款立体感极强的水平滚动动画菜单插件，插件允许你将图片分类显示，切换至该分类图片时，菜单就会很顺畅的将该类下的图片展示。



菜单演示   /   菜单素材下载

2、jQuery鼠标悬停图片动画HoverEx

jQuery鼠标悬停动画HoverEx插件，HoverEx是一款基于jQuery的鼠标停留动画插件，HoverEx一共有9组不同的动画效果。HoverEx非常适合对图片的快捷操作，比如选择图片或者旋转图片。



HoverEx演示   /   HoverEx下载

3、jQuery带小图标的图片滑动焦点图

这款jQuery焦点图的特点是带有小图片，鼠标点击小图标时便切换到相应图片，当然也能够自动切换图片。



焦点图演示   /   焦点图下载

4、jQuery仿搜狗输入法首页焦点图

这是一款基于jQuery的焦点图插件，该焦点图是模仿搜狗输入法首页（cheap car insurance）的图片展示模块，图片切换流畅，配置也十分简单。



焦点图演示   /   焦点图下载

5、jQuery原始图片对比插件

对图片渲染加工后，如果你想和原图做对比，那么这款jQuery原始图片对比插件就能很方便地帮你实现图片对比功能。鼠标拖动滑杆，就可在原图上对加工后的图片进行对比。



jQuery图片对比在线演示   /   jQuery图片对比源码下载

6、jQuery仿腾讯游戏上古世纪焦点图

这是一款用jQuery实现的游戏焦点图，效果挺棒的，适合游戏网站播放推广图片用。



jQuery焦点图演示   /   jQuery焦点图下载

7、jQuery环形图片播放插件

这是一款基于jQuery的环形焦点图，鼠标拖动环形边缘的小圆圈即可切换图片，是一款非常有特色的jQuery图片播放插件。



环形图片播放演示   /   环形图片播放下载

8、jQuery抖动动画焦点图

这是一款基于jQuery的动画焦点图，该焦点图在切换图片的时候会出现抖动动画，是一款很时尚的jQuery焦点图。



jQuery焦点图演示   /   jQuery焦点图下载

9、jQuery带文字描述的焦点图

这是一款基于jQuery的宽屏焦点图，该jQuery焦点图带有文字描述，文字描述区域和原图之间透明显示，非常大气。



jQuery焦点图演示   /   jQuery焦点图下载

10、jQuery实现3D圆盘图片播放，支持鼠标滚轮

这款相片播放工具是基于jQuery实现的3D圆盘类型的，图片像是在圆盘上旋转一样，支持鼠标滚轮，而且图片有漂亮的tooltip。



3D图片圆盘演示   /   3D图片圆盘下载

以上这些图片特效素材均来自国外的前端大牛制作，由网页素材大全网站整理，转载请注明出处。

原文链接：http://js.itivy.com/?p=605
10
顶
0
踩
评论 共 3 条 请登录后发表评论
3 楼 fjguodong 2013-06-26 23:12
太漂亮了！！！
2 楼 198432 2013-06-19 09:50
  • [list]
  • [list]
  • [*][list]
  • [*][*][list]
  • [*][*][*]
  • [*][*]
  • [*][/list]
  • [/list]
    • [/list]
    [/list]
    1 楼 libixionglbx 2013-06-18 11:34
    帅气的一笔啊

    发表评论

    您还没有登录,请您登录后再发表评论

    相关推荐

    • 数据库自增字段是字符型的简单处理

      在做数据库练习的时候，遇到一个问题，是以前从未接触但是看过人家实现的问题： ... 　MAX()-字段中大的值 　IsNull() 如为空为空 　思路： 　首先这是个自定义函数 　前面的XH固定 　年为YEAR(GE

    • ThinkPHP在模块所有方法前初始化函数

      1.例如直接_initialize()方法添加在模块Index的方法前 public function _initialize(){ //用于前置操作,前置判断(包括判断权限) } 该模块的所有方法执行前会首先执行_initialize()方法的内容 2.也可把这个放入...

    • struts开发实践—实用小贴士（下）

       三、图片的显示 1.写一个显示图片的Action，代码结构如下：public class PhotoAction extends Action {  private static final String CONTENT_TYPE = "image/gif";  public ActionForward perform(ActionMapping mapping, ActionF

    • 对数据表中大字段的处理方式

      在数据库中，经常需要用到大字段类型，如oracle中long/blob/clob,sqlserver中text/image，mysql中的text/longtext/clob/blob。 　存储的信息大概主要是两类，一类是长文本，...　那么假如现在有一个表，记录某人发布的

    • MySQL中大数据表增加字段的实现思路

      但是线上的一张表如果数据量很大呢，执行加字段操作就会锁表，这个过程可能需要很长时间甚至导致服务崩溃，那么这样操作就很有风险了。 那么，给 MySQL 大表加字段的思路如下： ① 创建一个临时的新表，首先复制...

    • 数据库中大字段的处理方式

      在数据库中，经常需要用到大字段类型，如oracle中long/blob/clob,sqlserver中text/image，mysql中的text/longtext/clob/blob。 　存储的信息大概主要是两类，一类是长...　那么假如现在有一个表，记录某人发布的文...

    • 数据库中大表增加字段（含默认值）比较慢，如何解决

      今天给一个千万级别的大表添加一个字段执行时特别慢，sql如下： 以sqlserver为例 alter table orderlog add realMoneyTotal [numeric](15, 2) NOT NULL default 0; 执行了几分钟，依然没有执行完成。 修改...

    • java读取Oracle中大字段数据（CLOB）的方法

      今天遇到一个难题，Oracle数据库中有一个字段是CLOB类型，java简单解析不了。去查找了一下解决方案，试了好几种，下面的这种是有效的。 public String ClobToString(Clob clob) throws SQLException, IOException { ...

    • mysql大字段怎么优化_Mysql多字段大表的几种优化方法？

      读写分离，这样能减少很多压力，而且数据稳定性也能提高纵向分表：根据原则，每个表最多不要超过5个索引，纵向拆分字段，将部分字段拆到一个新表通常我们按以下原则进行垂直拆分:(先区分这个表中的冷热数据字段)把不...

    • mysql快速删除大表数据部分数据_SQL Server大表如何快速删除数据

      在SQL Server中，如何快速删除大表中的数据呢？回答这个问题前，我们必须弄清楚上下文环境和以及结合实际、具体的需求，不同场景有不同的应对方法。1： 整张表的数据全部删除如果是整张表的数据全部清空、删除，这种...

    • [Power Query] 数据表规范性要求

      本文主要讲解数据表规范性要求

    • mysql大表数据抽取_从云数据迁移服务看MySQL大表抽取模式

      摘要：MySQL JDBC抽取到底应该采用什么样的方式，且听小编给你娓娓道来。小编最近在云上的一个迁移项目中被MySQL抽取模式折磨的很惨。一开始爆内存被客户怼，再后来迁移效率低下再被怼。MySQL JDBC抽取到底应该采用...

    • mysql大字段_JDBC读写MySQL的大字段数据

      因为大字段有些特殊，不同数据库处理的方式不一样，大字段的操作常常是以流的方式来处理的。而非一般的字段，一次即可读出数据。本人以前用到Spring+iBatis架构来操作大字段，结果以惨烈失败而告终，在网上寻求解决...

    • innodb中大字段的限制

      表结构大致如下： 发现导入的数据单行长度较长。 查看官方文档的解决办法为： Solution:1.divide your table into small ones. If one table contain more than 10 text colums, and the d...

    • 用JAVA正则表达式轻松替换JSON中大字段

      用JAVA正则表达式轻松替换JSON中大字段（一）背景（二）正则表达式（三）在JAVA代码中的实现（四）合并正则表达式（五）最终结果（六）所感 （一）背景 在软件开发工作中我们经常用JSON来传输数据，根据业务需要不免...

    • oracle的clob赋值_（转）如何对CLOB字段进行全文检索和oracle中大文字量的处理

      1、如何对CLOB字段进行全文检索？习惯了使用%来进行模糊查询，可发现在CLOB上行不通了，原来CLOB的查询是有专门的LOB操作工具的。说明： CLOB字段可以select，但select时不可以使用whereSQL> create table a(a ...

    • JPA中大字段的设置

      ...Spring 让 LOB 数据操作变得简单易行 JPA: how do I persist a String into a database field, type MYSQL Text 转载于:https://my.oschina.net/fxtxz2/blog/3047454

    • oracle drop字段报错,Oracle删除字段的方式和风险，你都了解么？

      一些和字段操作相关的历史文章，《新增字段的一点一滴技巧》《Oracle/EDB/达梦，对同字段多索引的支持》《探寻大表删除字段慢的原因》《大表删除字段为何慢？》《alter table新增字段操作究竟有何影响？(下篇)》...

    • Struts入门

      或许有人觉得struts不容易学，似乎里面的一些概念让未接触过的人迷惑，MVC1、MVC2、模式……我写这篇文章是想让从来没有接触过struts的人，能有个简单的入门指引，当然，系统地学习struts是必要的，里面有很多让人心醉的东东，那是后话了。 　　该案例包括首页，用户登陆、网站向导页面。就这么简单，没有深奥的struts概念，主要靠动手，然后用心体会。 　　WEB Server用to

    Global site tag (gtag.js) - Google Analytics