javascript经典特效分享 手风琴、轮播图、图片滑动

最近都没有更，就来几个效果充实一下。 都没有进行美化这步。

纯css的

手风琴：

手风琴css

接下来的都是会使用到动画效果，既然这样就把封装好运动：

0?speed:-speed;

clearInterval(obj.timer);
obj.timer=setInterval(function(){
if(!obj.num){
obj.num=0;
}
if(attr=="opacity"){
obj.num=parseFloat(getStyle(obj,attr))100+speed;
}else{
obj.num=parseInt(getStyle(obj,attr))+speed;
}
/这里是判断到了目标点没有，到了就停止定时器/
if(obj.num>=iTarget && obj.len>0 || obj.num<=iTarget && obj.len<0){
obj.num=iTarget;
clearInterval(obj.timer);
}
if(attr=="opacity"){
obj.style[attr]=obj.num/100;
}else{
obj.style[attr]=obj.num+"px";
}
/因为放在上面无法实现到回调函数的完整作用，出现一些BUG*/
if(obj.num>=iTarget && obj.len>0 || obj.num<=iTarget && obj.len<0){
fn && fn();
}
},30);

}
/获取css属性值的，会获取表现出现的值/
function getStyle(obj,attr){
return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];
}

轮播图：

轮播图

这个是使用插件做的：responsiveslides.js

基于jquery

Document

图片滑动：

图片滑动

• 
•