将ECSHOP的首页主广告轮播替换为CSS+JS,最模板方法一

2016-09-07 22:02 来源:www.chinab4c.com 作者:ecshop专家

效果如下图:
1.将以下代码存为form_css-js.js
 
/* Flash首页主广告轮播替换为Js轮播 - www.zuimoban.com */
 
var glide =new function(){
function $id(id){return document.getElementById(id);};
this.layerGlide=function(auto,oEventCont,oSlider,sSingleSize,second,fSpeed,point){
  var oSubLi = $id(oEventCont).getElementsByTagName('li');
  var interval,timeout,oslideRange;
  var time=1;
  var speed = fSpeed
  var sum = oSubLi.length;
  var a=0;
  var delay=second * 1000;
  var setValLeft=function(s){
   return function(){
    oslideRange = Math.abs(parseInt($id(oSlider).style[point]));
    $id(oSlider).style[point] =-Math.floor(oslideRange+(parseInt(s*sSingleSize) - oslideRange)*speed) +'px';
    if(oslideRange==[(sSingleSize * s)]){
     clearInterval(interval);
     a=s;
    }
   }
  };
 
  var setValRight=function(s){
   return function(){
    oslideRange = Math.abs(parseInt($id(oSlider).style[point]));
    $id(oSlider).style[point] =-Math.ceil(oslideRange+(parseInt(s*sSingleSize) - oslideRange)*speed) +'px';
    if(oslideRange==[(sSingleSize * s)]){
     clearInterval(interval);
     a=s;
    }
   }
  }
 
  function autoGlide(){
   for(var c=0;c<sum;c++){oSubLi1.className='';};
   clearTimeout(interval);
   if(a==(parseInt(sum)-1)){
    for(var c=0;c<sum;c++){oSubLi1.className='';};
    a=0;
    oSubLi[a].className="active";
    interval = setInterval(setValLeft(a),time);
    timeout = setTimeout(autoGlide,delay);
   }else{
    a++;
    oSubLi[a].className="active";
    interval = setInterval(setValRight(a),time);
    timeout = setTimeout(autoGlide,delay);
   }
  }
 
  if(auto){timeout = setTimeout(autoGlide,delay);};
  for(var i=0;i<sum;i++){
   oSubLi[i].onmouseover = (function(i){
    return function(){
     for(var c=0;c<sum;c++){oSubLi1.className='';};
     clearTimeout(timeout);
     clearInterval(interval);
     oSubLi[i].className="active";
     if(Math.abs(parseInt($id(oSlider).style[point]))>[(sSingleSize * i)]){
      interval = setInterval(setValLeft(i),time);
      this.onmouseout=function(){if(auto){timeout = setTimeout(autoGlide,delay);};};
     }else if(Math.abs(parseInt($id(oSlider).style[point]))<[(sSingleSize * i)]){
       interval = setInterval(setValRight(i),time);
      this.onmouseout=function(){if(auto){timeout = setTimeout(autoGlide,delay);};};
     }
    }
   })(i)
  }
}
}
glide.layerGlide(true,'icon_num','show_pic',710,3,0.1,'left');/*5是轮播速度设置*/
2.后台管理>首页主广告管理>自定义  功能内,插入以下代码,广告类型选择[代码]:
 
<script src="js/form_css-js.js" type=text/javascript></script>
(责任编辑:chinab4c)