下载了焦点图后怎么加入到自己的网页中？

我在懒人图库中下载了一个焦点图代码，之后怎么加入到自己的网页中？

不知道你下载的是哪一个焦点图代码,你把你下载的那个焦点图,弄成图片让我看下,我在一步一步告诉你如何放置在自已的网页中

放到网站的body里面

最好用table或者div来设计一个区块！

程序说明： 图片未开始转换时，由于没有图片会显示一个红x，所以隐藏图片： this._img.style.visibility = "hidden";

ps：以前我用this._img.src = "javascript:void(0);";但这个在ie8会出错。 这个变换效果需要滤镜，所以只支持ie。要使用变换滤镜，要先设置filter：

this._img.style.filter = "revealTrans()"

变换之前先设置两个参数Transition和Duration，分别是变换效果和持续时间，其中Duration是浮点数。 此外还有两个属性Enabled和Percent分别是是否激活滤镜和当前静态滤镜输出在转换进程中所处的点。 设置完后还需要运行apply和play方法，分别是应用变换效果和运行效果：

with(this._img.filters.revealTrans){     Transition = this.Transition; Duration = this.Duration; apply(); play(); }

除了这两个方法还有一个stop方法用来停止效果。

下面列出所有效果和对应Transition值（参考手册）： 值 : 效果 0  : 矩形收缩转换。 1  : 矩形扩张转换。 2  : 圆形收缩转换。 3  : 圆形扩张转换。 4  : 向上擦除。 5  : 向下擦除。 6  : 向右擦除。 7  : 向左擦除。 8  : 纵向百叶窗转换。 9  : 横向百叶窗转换。 10 : 国际象棋棋盘横向转换。 11 : 国际象棋棋盘纵向转换。 12 : 随机杂点干扰转换。 13 : 左右关门效果转换。 14 : 左右开门效果转换。 15 : 上下关门效果转换。 16 : 上下开门效果转换。 17 : 从右上角到左下角的锯齿边覆盖效果转换。 18 : 从右下角到左上角的锯齿边覆盖效果转换。 19 : 从左上角到右下角的锯齿边覆盖效果转换。 20 : 从左下角到右上角的锯齿边覆盖效果转换。 21 : 随机横线条转换。 22 : 随机竖线条转换。 23 : 随机使用上面可能的值转换。

其中23比较特别，是随机效果，程序默认就是随机效果。

设置完滤镜效果后就修改图片的src就开始转换了。

然后设置链接：

!!list["url"] ? (this._a.href = list["url"]) : this._a.removeAttribute("href");

要注意的是这里用removeAttribute去掉a的href才能去掉链接，如果只设为空那么链接还是去不掉的。 使用说明：

首先要实例化一个对象：

var rvt = new RevealTrans("idPicShow");

idPicShow就是显示变换的容器对象。

有以下这些可选参数和属性： 属性:默认值//说明 Auto:  true,//是否自动切换 Pause:  1000,//停顿时间(微妙) Duration: 1,//变换持续时间(秒) Transition: 23,//变换效果(23为随机) List:  [],//数据集合,如果这里不设置可以用Add方法添加 onShow:  function(){}//变换时执行

其中List是数据集合，其中每个元素结构是这样的：

{ img: 图片url, text: 相关文本, url: 相关链接 }

在使用时要注意，也可以在实例化之后用Add方法添加：

rvt.Add(' http://images.cnblogs.com/cnblogs_com/cloudgamer/143727/r_rt_1.jpg', '图片变换效果', ' http://www.cnblogs.com/cloudgamer/archive/2008/05/23/1205642.html');

可以一个一个添加，这样方便后台用循环输出数据。

至于图片列表、按钮和文本显示区域是自己扩展的部分，详细请看实例。 全部设置完成后就可以用Start开始变换程序了：

rvt.Start();

程序代码：

Code var RevealTrans = Class.create(); RevealTrans.prototype = {   initialize: function(container, options) {     this._img = document.createElement("img");     this._a = document.createElement("a");          this._timer = null;//计时器     this.Index = 0;//显示索引     this._onIndex = -1;//当前索引          this.SetOptions(options);          this.Auto = !!this.options.Auto;     this.Pause = Math.abs(this.options.Pause);     this.Duration = Math.abs(this.options.Duration);     this.Transition = parseInt(this.options.Transition);     this.List = this.options.List;     this.onShow = this.options.onShow;          //初始化显示区域     this._img.style.visibility = "hidden";//第一次变换时不显示红x图     this._img.style.width = this._img.style.height = "100%"; this._img.style.border = 0;     this._img.onmouseover = Bind(this, this.Stop);     this._img.onmouseout = Bind(this, this.Start);     isIE && (this._img.style.filter = "revealTrans()");          this._a.target = "_blank";          $(container).appendChild(this._a).appendChild(this._img);   },   //设置默认属性   SetOptions: function(options) {     this.options = {//默认值     Auto:    true,//是否自动切换     Pause:    1000,//停顿时间(微妙)     Duration:    1,//变换持续时间(秒)     Transition:    23,//变换效果(23为随机)     List:    [],//数据集合,如果这里不设置可以用Add方法添加     onShow:    function(){}//变换时执行     };     Extend(this.options, options || {});   },   Start: function() {     clearTimeout(this._timer);     //如果没有数据就返回     if(!this.List.length) return;     //修正Index     if(this.Index < 0 || this.Index >= this.List.length){ this.Index = 0; }     //如果当前索引不是显示索引就设置显示     if(this._onIndex != this.Index){ this._onIndex = this.Index; this.Show(this.List[this.Index]); }     //如果要自动切换     if(this.Auto){     this._timer = setTimeout(Bind(this, function(){ this.Index++; this.Start(); }), this.Duration * 1000 + this.Pause);     }   },   //显示   Show: function(list) {     if(isIE){     //设置变换参数     with(this._img.filters.revealTrans){     Transition = this.Transition; Duration = this.Duration; apply(); play();     }     }     this._img.style.visibility = "";     //设置图片属性     this._img.src = list.img; this._img.alt = list.text;     //设置链接     !!list["url"] ? (this._a.href = list["url"]) : this._a.removeAttribute("href");     //附加函数     this.onShow();   },   //添加变换对象   Add: function(sIimg, sText, sUrl) {     this.List.push({ img: sIimg, text: sText, url: sUrl });   },   //停止   Stop: function() {     clearTimeout(this._timer);   } };

你可以把代码粘贴到你的网页中 在你的网页<body></body>当中加入一般就可以了