UCH首页超靓 “JS图片滑动”广告代码

图片展示：

我网站为局域网网站，无法演示给大家看。
具体效果可以看这里：http://www.cnblogs.com/cloudgamer/archive/2008/05/13/1194272.html
使用方法以打包在压缩文件里。

应回复要求，使用方法如下：

index.htm为default模板首业模板文件，请无直接覆盖，请先备份你的文件。
修改办法：
  将image文件夹下图片放到template/default/image/下
  手工修改template/default/index.htm文件：
1、查找<style type="text/css"> 在其下方添加：
   #idGlideView{height:200px; border:solid 1px #999999;width: 970px; w\idth: 966px; }
#idGlideView div{width:500px;height:200px; border:none;}
  #idGlideView div a{width:500px;height:50px;filter: alpha(opacity=50);opacity: 0.5; background:#000; color:#fff; text-decoration:none;}
2、查找<script type="text/javascript">，将<script type="text/javascript">与</script>中间的代码修改为：
var $ = function (id) {
    return "string" == typeof id ? document.getElementById(id) : id;
};

function Event(e){
        var oEvent = document.all ? window.event : e;
        if (document.all) {
                if(oEvent.type == "mouseout") {
                        oEvent.relatedTarget = oEvent.toElement;
                }else if(oEvent.type == "mouseover") {
                        oEvent.relatedTarget = oEvent.fromElement;
                }
        }
        return oEvent;
}

function addEventHandler(oTarget, sEventType, fnHandler) {
        if (oTarget.addEventListener) {
                oTarget.addEventListener(sEventType, fnHandler, false);
        } else if (oTarget.attachEvent) {
                oTarget.attachEvent("on" + sEventType, fnHandler);
        } else {
                oTarget["on" + sEventType] = fnHandler;
        }
};

var Class = {
  create: function() {
    return function() {
      this.initialize.apply(this, arguments);
    }
  }
}

Object.extend = function(destination, source) {
    for (var property in source) {
        destination[property] = source[property];
    }
    return destination;
}


var GlideView = Class.create();
GlideView.prototype = {
  //容器对象 容器宽度 展示标签 展示宽度
  initialize: function(obj, iWidth, sTag, iMaxWidth, options) {
    var oContainer = $(obj), oThis=this, len = 0;
       
        this.SetOptions(options);
       
        this.Step = Math.abs(this.options.Step);
        this.Time = Math.abs(this.options.Time);
        this.Showtext = false;//是否显示说明文本
       
        this._list = oContainer.getElementsByTagName(sTag);
        len = this._list.length;
        this._count = len;
        this._width = parseInt(iWidth / len);
        this._width_max = parseInt(iMaxWidth);
        this._width_min = parseInt((iWidth - this._width_max) / (len - 1));
        this._timer = null;
       
        //有说明文本
        if(this.options.TextTag && this.options.TextHeight > 0){
                this.Showtext = true;
                this._text = oContainer.getElementsByTagName(this.options.TextTag);
                this._height_text = -parseInt(this.options.TextHeight);
        }
       
        this.Each(function(oList, oText, i){
                oList._target = this._width * i;//自定义一个属性放目标left
                oList.style.left = oList._target + "px";
                oList.style.position = "absolute";
                addEventHandler(oList, "mouseover", function(){ oThis.Set.call(oThis, i); });
               
                //有说明文本
                if(oText){
                        oText._target = this._height_text;//自定义一个属性放目标bottom
                        oText.style.bottom = oText._target + "px";
                        oText.style.position = "absolute";
                }
        })
       
        //容器样式设置
        oContainer.style.width = iWidth + "px";
        oContainer.style.overflow = "hidden";
        oContainer.style.position = "relative";
        //移出容器时返回默认状态
        addEventHandler(oContainer, "mouseout", function(e){
                //变通防止执行oList的mouseout
                var o = Event(e).relatedTarget;
                if (oContainer.contains ? !oContainer.contains(o) : oContainer != o && !(oContainer.compareDocumentPosition(o) & 16)) oThis.Set.call(oThis, -1);
        })
  },
  //设置默认属性
  SetOptions: function(options) {
    this.options = {//默认值
                Step:                        20,//滑动变化率
                Time:                        20,//滑动延时
                TextTag:                "",//说明容器tag
                TextHeight:                0//说明容器高度
    };
    Object.extend(this.options, options || {});
  },
  //相关设置
  Set: function(index) {
        if (index < 0) {
                //鼠标移出容器返回默认状态
                this.Each(function(oList, oText, i){ oList._target = this._width * i; if(oText){ oText._target = this._height_text; } })
        } else {
                //鼠标移到某个滑动对象上
                this.Each(function(oList, oText, i){
                        oList._target = (i <= index) ? this._width_min * i : this._width_min * (i - 1) + this._width_max;
                        if(oText){ oText._target = (i == index) ? 0 : this._height_text; }
                })
        }
        this.Move();
  },
  //移动
  Move: function() {
        clearTimeout(this._timer);
        var bFinish = true;//是否全部到达目标地址
        this.Each(function(oList, oText, i){
                var iNow = parseInt(oList.style.left), iStep = this.GetStep(oList._target, iNow);
                if (iStep != 0) { bFinish = false; oList.style.left = (iNow + iStep) + "px"; }
                //有说明文本
                if (oText) {
                        iNow = parseInt(oText.style.bottom), iStep = this.GetStep(oText._target, iNow);
                        if (iStep != 0) { bFinish = false; oText.style.bottom = (iNow + iStep) + "px"; }
                }
        })
        //未到达目标继续移动
        if (!bFinish) { var oThis = this; this._timer = setTimeout(function(){ oThis.Move(); }, this.Time); }
  },
  //获取步长
  GetStep: function(iTarget, iNow) {
        var iStep = (iTarget - iNow) / this.Step;
        if (iStep == 0) return 0;
        if (Math.abs(iStep) < 1) return (iStep > 0 ? 1 : -1);
        return iStep;
  },
  Each:function(fun) {
        for (var i = 0; i < this._count; i++)
                fun.call(this, this._list, (this.Showtext ? this._text : null), i);
  }
};

window.onload=function(){
        new GlideView("idGlideView", 728, "div", 500, { TextTag: "a", TextHeight: 50 });
}
3、查找<div id="guestbar" class="nbox"> 将其下第一个<div class="nbox_c">与</div>中代码修改为：
          <div id="idGlideView">
        <div style="background:url(image/pic2_big.jpg);"><a href="fgame.php?ac=home"><img src="image/pic2.jpg" width=500px alt="Flash小游戏 别样的精彩" title="在线小游戏" border="0" /></a></div>
        <div style="background:url(image/pic3_big.jpg);"><a href="picwall/index.html"><img src="image/pic3.jpg" width=500px alt="个性照片浏览 不一样的心动理工" title="个性照片浏览 不一样的心动理工" border="0" /></a></div>
        <div style="background:url(image/pic1_big.jpg);"><a href="http://www.icqut.cn/icqut_kindon.html"><img src="image/pic1.jpg" width=500px alt="金盾西服 - 成功的标志" title="垂询电话:15802392567" border="0" /></a></div>
        <div style="background:url(image/pic4_big.jpg);"><a href="http://www.icqut.cn/info.php"><img src="image/pic4.jpg" width=500px alt="心动理工分类信息 二手交易" title="心动理工分类信息 二手交易" border="0" /></a></div>
      </div>
4、自行修改图片以及图片alt\title\连接地址等；
5、后台更新缓存，查看首业。
备注：图片大小等均可根据需要自行修改，图片数量可以增加删除，结合修改js、CSS代码可改变其不同样式。

非常炫~顶一下~~~

感谢提供 收了~~

最好将设置方法一起写出来~~~

这样可以方便更多人安装使用~~~

确实挺漂亮的，喜欢

很漂亮，虽然不用，顶你

wowo风格。暂时用不上！

感觉有点卡啊

顶顶更健康

踩一下，留个位！

打不开了～～郁闷