标题+图片绚丽幻灯片JQ+CSS特效

此特效为JQ+div+css的幻灯片特效，标题+焦点+图片幻灯片JQ特效。标题背景为半透明，漂亮幻灯片。

JS+cSS幻灯片效果截图

此幻灯片为非常常用的幻灯片特效，标题文字+图片+焦点1 2 3数字，并且标题文字背景半透明。

使用说明：修改对应CSS+JS代码设置好宽度、高度即可适用你的CSS项目，兼容各大浏览器。

<script type="text/javascript">  
$(function(){ 
    new slide("#main-slide","cur",370,220,1);//焦点图 宽度、高度设置
}) 
function $jquery(id){return document.getElementById(id)}; 
</script> 

以上为HTML中特效JS片段需要注意宽度高度设置。

.slide{overflow:hidden;_float:left;zoom:1; margin:0 auto; width:370px} 
 
/* 默认幻灯片 */ 
.FocusPic{zoom:1;position:relative; overflow:hidden} 
.FocusPic .content{overflow:hidden} 
.FocusPic .changeDiv a{position:absolute;top:0px;left:0px;display:none;} 
.FocusPic .subjectg,.FocusPic .title{position:absolute;left:0px;bottom:0;
 text-align:left;width:370px;height:30px;line-height:30px;overflow:hidden} 
.FocusPic .subjectg{background:#000;filter:alpha(opacity=50);opacity:0.5;} 
.FocusPic .title a{display:block;padding-left:15px;color:#fff; font-size:14px;} 
.FocusPic .change{bottom:4px;height:20px;right:3px;*right:5px;_right:4px;position:absolute;
text-align:right;z-index:9999;} 
.FocusPic .change i {background:#666;color:#FFF;cursor:pointer;font-family:Arial;font-size:12px;
line-height:15px;margin-right:2px;padding:2px 6px; font-style:normal; height:15px;display:inline-block;
display:-moz-inline-stack;zoom:1;*display:inline;} 
.FocusPic .change i.cur {background:#FF7700;} 

以上CSS代码为此特效CSS代码，根据需求修改对应即可。

在线演示：查看案例

在线打包下载：