此作品是一款非常实用的jquery焦点图，用jquery实现8图带标题描述的图片轮播特效，
包括了图片播放、图片轮播、滑动效果、遮罩层，jquery相册、鼠标悬浮、自动播放等功能。。。
页面初始化就一行代码：
<!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>jquery实现8图带标题描述的图片轮播特效</title>
<link href="template/anisee/css/style.css" rel="stylesheet" type="text/css" />
<script src="template/anisee/js/jquery.js" type="text/javascript"></script>
<script src="template/anisee/js/slider.js" type="text/javascript"></script>
<script src="template/anisee/js/common.js" type="text/javascript"></script>
</head>
<body>
<div id="screen" class="wrap clear">
<div class="bd">
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/conan.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">名侦探柯南</a></h2>
<p>人称日本警察之救世主的高中生侦探工藤新一在与青梅竹马毛利兰去游乐园游玩时，不经意地发现行踪可疑的黑衣人。工藤新一于是尾随跟踪，并目睹了黑衣人正在进行可疑交易......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/slam.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">灌篮高手</a></h2>
<p>初中时已是篮球高手的流川枫，大病初愈的宫城良田，曾误入歧途的初中时MVP三井寿加入湘北篮球队，使赤木队长的称霸全国不再只是梦想......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/chibi.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">樱桃小丸子</a></h2>
<p>故事围绕着小丸子以及其家人和同学展开，有关于亲情、友谊等，或是一些生活小事，但当中有笑有泪，令人回想起童年的稚气......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/shin.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">蜡笔小新</a></h2>
<p>。作者臼井仪人从日常生活中的故事取材，叙述小新在日常生活中所发生的事情。小新是一个有点调皮的小孩，他喜欢别出心裁，富于幻想......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/digimon.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">数码兽合体战争</a></h2>
<p>故事的主线围绕少年们成为数码宝贝军的指挥官和敌对的数码宝贝军进行战斗而展开。即“数码宝贝军VS数码宝贝军！空前绝后的大战即将开始！</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/conan.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">名侦探柯南</a></h2>
<p>人称日本警察之救世主的高中生侦探工藤新一在与青梅竹马毛利兰去游乐园游玩时，不经意地发现行踪可疑的黑衣人。工藤新一于是尾随跟踪，并目睹了黑衣人正在进行可疑交易......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/slam.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">灌篮高手</a></h2>
<p>初中时已是篮球高手的流川枫，大病初愈的宫城良田，曾误入歧途的初中时MVP三井寿加入湘北篮球队，使赤木队长的称霸全国不再只是梦想......</p>
</div>
</div>
<div class="mt"><a href="http://www.codesocang.com"><img src="pic/slide/chibi.jpg" /></a>
<div class="bg"></div>
<div>
<h2><a href="http://www.codesocang.com" onfocus="this.blur()">樱桃小丸子</a></h2>
<p>故事围绕着小丸子以及其家人和同学展开，有关于亲情、友谊等，或是一些生活小事，但当中有笑有泪，令人回想起童年的稚气......</p>
</div>
</div>
</div>
<div class="hd">
<ul>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/conan.jpg"><span class="txt">名侦探柯南</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/slam.jpg"><span class="txt">灌篮高手</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/chibi.jpg"><span class="txt">樱桃小丸子</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/shin.jpg"><span class="txt">蜡笔小新</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/digimon.jpg"><span class="txt">数码兽合体战争</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/conan.jpg"><span class="txt">名侦探柯南</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/slam.jpg"><span class="txt">灌篮高手</span><span class="bg"></span> <span class="mask"></span></a></li>
<li><a href="http://www.codesocang.com" onfocus="this.blur()"> <img src="pic/slide/chibi.jpg"><span class="txt">樱桃小丸子</span><span class="bg"></span> <span class="mask"></span></a></li>
</ul>
</div>
</div>
<script>anisee.init.screens()</script>
<center>
<span style="font-size:15px; font-weight:bold; text-align:center; line-height:25px; color:#000; width:100%">jquery实现8图带标题描述的图片轮播特效<br />
<a href="http://www.codesocang.com" target="_blank" style="color:#000">源码搜藏</a>网站出品（<a href="http://www.codesocang.com" style="color:#000" target="_blank">http://www.codesocang.com</a>） <br />
<a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=b8456df79a15d7f2738f6d98794ea09d0b6db0cede06c5dd18bc4c196e3163bd">官方网站学习交流QQ群<img border="0" src="http://pub.idqqimg.com/wpa/images/group.png" style="width:90px; height:22px;" alt="源码搜藏" width="90" height="22" title="源码搜藏"></a></span>
</center>
</body>
</html>
兼容IE8的jQuery幻灯片切换代码
jQuery全屏banner图片切换焦点图简洁代码
基于slick幻灯片插件制作的一款jQuery背景图片切换效果
jQuery带视觉差效果幻灯片代码
jQuery多种切片过渡动画幻灯片代码