效果图:

查看效果:http://hovertree.com/jq/hovertreeimg/

下载:http://hovertree.com/h/bjaf/gk8mko69.htm

使用代码:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>HovertreeImg Home - 何问起</title><base target="_blank" />
<meta charset="utf-8" />
<!--<link href="jquery.hovertreeimg.css" type="text/css" rel="stylesheet"/>-->
<style>#hovertreeimg {width:768px;height:66px;overflow:hidden}
#hovertreeimg img{width:100%;height:100%;}
#hovertreeimg #hovertreeimgcontent{display:none}a{color:blue}</style>
</head>
<body>
<div id="hovertreeimg">
<a href="http://hovertree.com/h/bjaf/hovertreeimg.htm" title="HovertreeImg" target="_blank"><img src="http://hovertree.com/jq/hovertreeimg/hovertreeimg.jpg" alt="HovertreeImg插件" /></a>
<div id="hovertreeimgcontent">
<a href="http://hovertree.com/h/bjaf/easysector.htm" title="HTML5百分比饼图" target="_blank"><img src="http://hovertree.com/themes/img/easysector.gif" alt="EasySector插件" /></a>
<a href="http://hovertree.com/texiao/game/" title="见缝插针" target="_blank"><img src="http://hovertree.com/themes/img/jfcz.gif" alt="见缝插针" /></a>
</div>
</div>
<div>
<br /><br />
<a href="http://hovertree.com">HoverTree</a>
<a href="http://hovertree.com/texiao/hovertreeimg/">HovertreeImg Home</a>
<a href="http://hovertree.com/h/bjaf/hovertreeimg.htm">Help</a>
<a href="https://www.npmjs.com/package/hovertreeimg">NPM</a>
<a href="https://github.com/shangyuxian/hovertreeimg">Github</a><br />
</div> <script src="http://hovertree.com/ziyuan/jquery/jquery-1.12.0.min.js"></script>
<script src="http://hovertree.com/jq/hovertreeimg/jquery.hovertreeimg.js"></script>
<script>
$("#hovertreeimg").hovertreeimg({
"h_circlePosition": "",//left,right,center
"h_width": 768,
"h_height": 66,
"h_borderColor":"silver",
"h_circleWidth": 14
});
</script>
</body>
</html>

更多:http://www.cnblogs.com/roucheng/p/texiao.html

jQuery自动与手动图片切换效果下载的更多相关文章

  1. jquery带按钮的图片切换效果

    <!doctype html> <html> <head> <meta charset="gb2312"> <title> ...

  2. jQuery plugin : bgStretcher 背景图片切换效果插件

    转自:http://blog.dvxj.com/pandola/jQuery_bgStretcher.html bgStretcher 2011 (Background Stretcher)是一个jQ ...

  3. 10款好用的 jQuery 图片切换效果插件

    jQuery 是一个非常优秀的 Javascript 框架,使用简单灵活,同时还有许多成熟的插件可供选择.其中,最令人印象深刻的应用之一就是对图片的处理,它可以让帮助你在你的项目中加入一些让人惊叹的效 ...

  4. jquery简单的图片切换效果,支持pc端、移动端的banner图片切换开发

    详细内容请点击 无意中看见了两年前写的一个图片切换,那会儿刚刚学习网页制作,可以说是我的第一个处女座的jquery图片切换效果.无聊之余对它的宽度稍稍做了一下修改,变成了支持pc端.手机端全屏的ban ...

  5. 精致3D图片切换效果,最适合企业产品展示

    这是一个精致的立体图片切换效果,特别适合企业产品展示,可立即用于实际项目中.支持导航和自动播放功能, 基于 CSS3 实现,推荐使用最新的 Chrome,Firefox 和 Safari 浏览器浏览效 ...

  6. 一款基于jquery超炫的图片切换特效

    今天为给大家介绍一款基于jquery超炫的图片切换特效.由百叶窗飞入显示图片.图片消息的时候也是百叶窗渐行渐远.用于图片展示,效果还是非常好,我们一起看下效果图: 在线预览   源码下载 来看下实现的 ...

  7. js鼠标滚轮滚动图片切换效果

    效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...

  8. jQuery手机端触摸卡片切换效果

    效果:http://hovertree.com/code/run/jquery/a1gr3gm9.html 可以用手机查看效果. 代码如下: <!doctype html> <htm ...

  9. 100种不同图片切换效果插件pageSwitch

    分享100种不同图片切换效果插件pageSwitch.这是一款适用于全屏切换场景,即一切一屏,并且实现了超过一百种切换效果,支持自定义切页动画.效果图如下: 在线预览   源码下载 实现的代码. ht ...

随机推荐

  1. Web应用程序的自动化测试库-FluentAutomation

    FluentAutomation是流畅的自动化应用编程接口,支持Selenium和WatiN 连同它们所有的风格和驱动程序.自从Fluient支持Selenium,那就意味着你可以使用Selenium ...

  2. Android安全开发之ZIP文件目录遍历

    1.ZIP文件目录遍历简介 因为ZIP压缩包文件中允许存在“../”的字符串,攻击者可以利用多个“../”在解压时改变ZIP包中某个文件的存放位置,覆盖掉应用原有的文件.如果被覆盖掉的文件是动态链接s ...

  3. Lesson 2 Breakfast or lunch?

    Text It was Sunday. I never get up early on Sundays. I sometimes stay in bed until lunchtime. Last S ...

  4. R in Action 读书笔记(4)

    MindMapper 原文件

  5. DataBase异常状态:Recovery Pending,Suspect,估计Recovery的剩余时间

    一,RECOVERY PENDING状态 今天修改了SQL Server的Service Account的密码,然后重启SQL Server的Service,发现有db处于Recovery Pendi ...

  6. Caffe学习笔记1--Ubuntu 14.04 64bit caffe安装

    本篇博客主要用于记录Ubuntu 14.04 64bit操作系统搭建caffe环境,目前针对的的是CPU版本: 1.安装依赖库 sudo apt-get install libprotobuf-dev ...

  7. 不使用session,借助redis实现验证码

    1.首先看一下基本的流程 2.看一下代码 注:其中用到的一些工具类,可以到我的github上去下载  https://github.com/hjzgg/usually_util/tree/master ...

  8. 用js实现放大镜的效果

    第一次发博客,还有点小激动,本人现在正在天津上大学,希望以后从事前端这一行业,学习的时间不长,写博客为了记录自己的学习过程和收获,当然也算是巩固.可能写的东西不会像大牛那样高大上,只是一些基本的内容, ...

  9. Util应用程序框架公共操作类(十二):Lambda表达式公共操作类(三)

    今天在开发一个简单查询时,发现我的Lambda操作类的GetValue方法无法正确获取枚举类型值,以至查询结果错误. 我增加了几个单元测试来捕获错误,代码如下. /// <summary> ...

  10. mysqldump的实现原理

    对于MySQL的备份,可分为以下两种: 1. 冷备 2. 热备 其中,冷备,顾名思义,就是将数据库关掉,利用操作系统命令拷贝数据库相关文件.而热备指的是在线热备,即在不关闭数据库的情况下,对数据库进行 ...