请帮我看看代码中哪里是实现图片逐渐变大变小效果的,我现在想取消渐变效果,请高手帮帮忙!!!
var imf = function() {
var lf = 0;
var instances = []; //获取指定类名的指定标签
function getElementsByClass(object, tag, className) {
var o = object.getElementsByTagName(tag);
for (var i = 0, n = o.length, ret = []; i < n; i++)
if (o[i].className == className) ret.push(o[i]);
if (ret.length == 1) ret = ret[0];
return ret;
} //添加事件
function addEvent(o, e, f) {
if (window.addEventListener) o.addEventListener(e, f, false); //addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉
else if (window.attachEvent) r = o.attachEvent('on' + e, f);
} function createReflexion(cont, img) { } /* //////////// ==== ImageFlow Constructor ==== //////////// */
function ImageFlow(oCont, size, zoom, border) {
this.diapos = [];
this.scr = false;
this.size = size;
this.zoom = zoom;
this.bdw = border;
this.oCont = oCont;
this.oc = document.getElementById(oCont);
this.scrollbar = getElementsByClass(this.oc, 'div', 'scrollbar');
this.arL = getElementsByClass(this.oc, 'img', 'arrow-left');
this.arR = getElementsByClass(this.oc, 'img', 'arrow-right');
this.alw = this.arL.width - 5;
this.arw = this.arR.width - 5;
this.arL.parent = this.arR.parent = this;
this.view = this.back = -1;
this.resize();
this.oc.onselectstart = function() { return false; }
/* ---- create images ---- */
var img = getElementsByClass(this.oc, 'div', 'bank').getElementsByTagName('img');
this.NF = img.length;
for (var i = 0, o; o = img[i]; i++) {
this.diapos[i] = new Diapo(this, i, o.getAttribute("src"),
// o.title || '- ' + i + ' -',
o.getAttribute("title") || '',
'',
// o.innerHTML || o.src,
o.href || '', o.target || '');
}
/* ==== right arrow右滚动按钮事件 ==== */
this.arR.onclick = this.arR.ondblclick = function() {
if (this.parent.view < this.parent.NF - 1)
this.parent.calc(1);
}
/* ==== Left arrow左滚动按钮事件 ==== */
this.arL.onclick = this.arL.ondblclick = function() {
if (this.parent.view > 0)
this.parent.calc(-1);
// if(this.parent.view <= 0)
// this.parent.calc(5);
}
}
/* //////////// ==== ImageFlow prototype ==== //////////// */
ImageFlow.prototype = {
/* ==== targets ==== */
calc: function(inc) {
if (inc) this.view += inc;
var tw = 0;
var lw = 0;
var o = this.diapos[this.view];
if (o && o.loaded) {
/* ---- reset ---- */
var ob = this.diapos[this.back];
if (ob && ob != o) {
ob.img.className = 'diapo';
ob.z1 = 1;
}
// /* ---- update legend ---- */
// this.title.replaceChild(document.createTextNode(o.title), this.title.firstChild);
// this.legend.replaceChild(document.createTextNode(o.text), this.legend.firstChild);
// this.title.replaceChild(document.createTextNode(''), this.title.firstChild); //把class=title的div替换为空值
// this.legend.replaceChild(document.createTextNode(''), this.legend.firstChild); //把class=legend的div替换为空值 /* ---- update hyperlink ---- *///更新超链接
if (o.url) {
o.img.className = 'diapo link';
window.status = 'hyperlink: ' + o.url;
} else {
o.img.className = 'diapo';
window.status = '';
}
/* ---- calculate target sizes & positions ---- */
o.w1 = Math.min(o.iw, this.wh * 0.5) * o.z1; //计算大图片的大小
var x0 = o.x1 = (this.wh * .4) - (o.w1 * .5); //中间图片位置
var x = x0 + o.w1 + this.bdw;
for (var i = this.view + 1, o; o = this.diapos[i]; i++) {
if (o.loaded) {
o.x1 = x;
o.w1 = (this.ht / o.r) * this.size;
x += o.w1 + this.bdw;
tw += o.w1 + this.bdw;
}
}
x = x0 - this.bdw;
for (var i = this.view - 1, o; o = this.diapos[i]; i--) {
if (o.loaded) {
o.w1 = (this.ht / o.r) * this.size;
o.x1 = x - o.w1;
x -= o.w1 + this.bdw;
tw += o.w1 + this.bdw;
lw += o.w1 + this.bdw;
}
}
/* ---- save preview view ---- */
this.back = this.view;
}
},
/* ==== mousewheel scrolling ==== */
scroll: function(sc) {
if (sc < 0) {
if (this.view < this.NF - 1) this.calc(1);
} else {
if (this.view > 0) this.calc(-1);
}
},
/* ==== resize ==== */
resize: function() { this.wh = this.oc.clientWidth;
this.ht = this.oc.clientHeight;
// this.ws = this.scrollbar.offsetWidth;
this.calc();
this.run(true);
},
/* ==== move all images ==== */
run: function(res) {
var i = this.NF;
while (i--) this.diapos[i].move(res);
}
}
var imf = function() {
var lf = 0;
var instances = []; //获取指定类名的指定标签
function getElementsByClass(object, tag, className) {
var o = object.getElementsByTagName(tag);
for (var i = 0, n = o.length, ret = []; i < n; i++)
if (o[i].className == className) ret.push(o[i]);
if (ret.length == 1) ret = ret[0];
return ret;
} //添加事件
function addEvent(o, e, f) {
if (window.addEventListener) o.addEventListener(e, f, false); //addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉
else if (window.attachEvent) r = o.attachEvent('on' + e, f);
} function createReflexion(cont, img) { } /* //////////// ==== ImageFlow Constructor ==== //////////// */
function ImageFlow(oCont, size, zoom, border) {
this.diapos = [];
this.scr = false;
this.size = size;
this.zoom = zoom;
this.bdw = border;
this.oCont = oCont;
this.oc = document.getElementById(oCont);
this.scrollbar = getElementsByClass(this.oc, 'div', 'scrollbar');
this.arL = getElementsByClass(this.oc, 'img', 'arrow-left');
this.arR = getElementsByClass(this.oc, 'img', 'arrow-right');
this.alw = this.arL.width - 5;
this.arw = this.arR.width - 5;
this.arL.parent = this.arR.parent = this;
this.view = this.back = -1;
this.resize();
this.oc.onselectstart = function() { return false; }
/* ---- create images ---- */
var img = getElementsByClass(this.oc, 'div', 'bank').getElementsByTagName('img');
this.NF = img.length;
for (var i = 0, o; o = img[i]; i++) {
this.diapos[i] = new Diapo(this, i, o.getAttribute("src"),
// o.title || '- ' + i + ' -',
o.getAttribute("title") || '',
'',
// o.innerHTML || o.src,
o.href || '', o.target || '');
}
/* ==== right arrow右滚动按钮事件 ==== */
this.arR.onclick = this.arR.ondblclick = function() {
if (this.parent.view < this.parent.NF - 1)
this.parent.calc(1);
}
/* ==== Left arrow左滚动按钮事件 ==== */
this.arL.onclick = this.arL.ondblclick = function() {
if (this.parent.view > 0)
this.parent.calc(-1);
// if(this.parent.view <= 0)
// this.parent.calc(5);
}
}
/* //////////// ==== ImageFlow prototype ==== //////////// */
ImageFlow.prototype = {
/* ==== targets ==== */
calc: function(inc) {
if (inc) this.view += inc;
var tw = 0;
var lw = 0;
var o = this.diapos[this.view];
if (o && o.loaded) {
/* ---- reset ---- */
var ob = this.diapos[this.back];
if (ob && ob != o) {
ob.img.className = 'diapo';
ob.z1 = 1;
}
// /* ---- update legend ---- */
// this.title.replaceChild(document.createTextNode(o.title), this.title.firstChild);
// this.legend.replaceChild(document.createTextNode(o.text), this.legend.firstChild);
// this.title.replaceChild(document.createTextNode(''), this.title.firstChild); //把class=title的div替换为空值
// this.legend.replaceChild(document.createTextNode(''), this.legend.firstChild); //把class=legend的div替换为空值 /* ---- update hyperlink ---- *///更新超链接
if (o.url) {
o.img.className = 'diapo link';
window.status = 'hyperlink: ' + o.url;
} else {
o.img.className = 'diapo';
window.status = '';
}
/* ---- calculate target sizes & positions ---- */
o.w1 = Math.min(o.iw, this.wh * 0.5) * o.z1; //计算大图片的大小
var x0 = o.x1 = (this.wh * .4) - (o.w1 * .5); //中间图片位置
var x = x0 + o.w1 + this.bdw;
for (var i = this.view + 1, o; o = this.diapos[i]; i++) {
if (o.loaded) {
o.x1 = x;
o.w1 = (this.ht / o.r) * this.size;
x += o.w1 + this.bdw;
tw += o.w1 + this.bdw;
}
}
x = x0 - this.bdw;
for (var i = this.view - 1, o; o = this.diapos[i]; i--) {
if (o.loaded) {
o.w1 = (this.ht / o.r) * this.size;
o.x1 = x - o.w1;
x -= o.w1 + this.bdw;
tw += o.w1 + this.bdw;
lw += o.w1 + this.bdw;
}
}
/* ---- save preview view ---- */
this.back = this.view;
}
},
/* ==== mousewheel scrolling ==== */
scroll: function(sc) {
if (sc < 0) {
if (this.view < this.NF - 1) this.calc(1);
} else {
if (this.view > 0) this.calc(-1);
}
},
/* ==== resize ==== */
resize: function() { this.wh = this.oc.clientWidth;
this.ht = this.oc.clientHeight;
// this.ws = this.scrollbar.offsetWidth;
this.calc();
this.run(true);
},
/* ==== move all images ==== */
run: function(res) {
var i = this.NF;
while (i--) this.diapos[i].move(res);
}
}
Diapo = function(parent, N, src, title, text, url, target) {
this.parent = parent;
this.loaded = false;
this.title = title;
this.text = text;
this.url = url;
this.target = target;
this.N = N;
this.img = document.createElement('img');
this.img.setAttribute('src', src);
this.img.parent = this;
this.img.className = 'diapo';
this.x0 = this.parent.oc.clientWidth; //获取浏览器宽度
this.x1 = this.x0;
this.w0 = 0;
this.w1 = 0;
this.z1 = 1;
this.img.parent = this;
this.img.onclick = function() { this.parent.click(); } document.getElementById('show').appendChild(this.img);
/* ---- display external link ---- */
if (url) {
this.img.onmouseover = function() { this.className = 'diapo link'; }
this.img.onmouseout = function() { this.className = 'diapo'; }
}
}
/* //////////// ==== Diapo prototype ==== //////////// */
Diapo.prototype = {
/* ==== HTML rendering ==== */
move: function(res) {
if (this.loaded) {
var sx = this.x1 - this.x0;
var sw = this.w1 - this.w0;
if (Math.abs(sx) > 2 || Math.abs(sw) > 2 || res) {
/* ---- paint only when moving ---- */
this.x0 += sx * .1;
this.w0 += sw * .1;
if (this.x0 < this.parent.wh && this.x0 + this.w0 > 0) {
/* ---- paint only visible images ---- */
this.visible = true;
var o = this.img.style;
var h = this.w0 * this.r;
/* ---- diapo ---- */
o.left = Math.round(this.x0) + 'px';
o.bottom = Math.floor(this.parent.ht * .25) + 'px';
o.width = Math.round(this.w0) + 'px';
o.height = Math.round(h) + 'px';
/* ---- reflexion ---- */
if (this.flx) {
var o = this.flx.style;
o.left = Math.round(this.x0) + 'px';
o.top = Math.ceil(this.parent.ht * .75 + 1) + 'px';
o.width = Math.round(this.w0) + 'px';
o.height = Math.round(h) + 'px';
}
} else {
/* ---- disable invisible images ---- */
if (this.visible) {
this.visible = false;
this.img.style.width = '0px';
if (this.flx) this.flx.style.width = '0px';
}
}
}
} else {
/* ==== image onload ==== */
if (this.img.complete && this.img.width) {
/* ---- get size image ---- */
this.iw = this.img.width;
this.ih = this.img.height;
this.r = this.ih / this.iw;
this.loaded = true;
/* ---- create reflexion ---- */
this.flx = createReflexion(this.parent.oc, this.img);
if (this.parent.view < 0) this.parent.view = this.N;
this.parent.calc();
}
}
},
/* ==== diapo onclick ==== */
click: function() { if (this.parent.view == this.N) {
/* ---- click on zoomed diapo ---- */
if (this.url) {
/* ---- open hyperlink ---- */
/*window.open(this.url, this.target);*/
return;
} else {
/* ---- zoom in/out ---- */
this.z1 = this.z1 == 1 ? this.parent.zoom : 1;
this.parent.calc();
}
} else {
/* ---- select diapo ---- */
this.parent.view = this.N;
this.parent.calc();
}
return false;
}
}
/* //////////// ==== public methods ==== //////////// */
return {
/* ==== initialize script ==== */
create: function(div, size, zoom, border) {
/* ---- instanciate imageFlow ---- */
var load = function() {
var loaded = false;
var i = instances.length;
while (i--) if (instances[i].oCont == div) loaded = true;
if (!loaded) {
/* ---- push new imageFlow instance ---- */
instances.push(
new ImageFlow(div, size, zoom, border)
); /* ---- init script (once) ---- */
if (!imf.initialized) {
imf.initialized = true;
/* ---- window resize event ---- */
addEvent(window, 'resize', function() {
var i = instances.length;
while (i--) instances[i].resize();
});
/* ---- set interval loop ---- */
setInterval(function() {
var i = instances.length;
while (i--) instances[i].run();
}, 1);
}
}
}
/* ---- window onload event ---- */
addEvent(window, 'load', function() { load(); });
}
}
} (); /* ==== create imageFlow ==== */
// div ID , size, zoom, border
// imf.create("imageFlow", 0.15, 1.5, 10);说明:size为小图片的大小;border为图片间的间距
// imf.create("imageFlow", 0.0610909, 1.5, 0);
imf.create("imageFlow", 0.12, 0,0);
resize: function() { this.wh = this.oc.clientWidth;
this.ht = this.oc.clientHeight;
// this.ws = this.scrollbar.offsetWidth;
this.calc();
this.run(true);
},
/* ==== right arrow右滚动按钮事件 ==== */
this.arR.onclick = this.arR.ondblclick = function() {
if (this.parent.view < this.parent.NF - 1)
this.parent.calc(1);
}
/* ==== Left arrow左滚动按钮事件 ==== */
this.arL.onclick = this.arL.ondblclick = function() {
if (this.parent.view > 0)
this.parent.calc(-1);
// if(this.parent.view <= 0)
// this.parent.calc(5);
}
/* ---- paint only when moving ---- */
this.x0 += sx * .1;
this.w0 += sw * .1;
搞定了!原来是这段!!!!!