一个循环显示图片(缩略图)的页面,当点击复制按钮后可以将这个缩略图复制,并可以粘贴在QQ或eWebEditor的编辑器中........
现有代码,只能复制当前页面id="show"的缩略图请问如何修改,才能复制大图呢?(就是点击小图后显示的大图)源代码如下:
==========================<script type="text/javascript">function OutDemo(img)
{
if (navigator.appVersion.indexOf("MSIE") == -1) return;
var demo = document.getElementById('DemoImg');
demo.style.display = 'none';
}function OverDemo(img)
{
if (navigator.appVersion.indexOf("MSIE") == -1) return;
if (img.alt == '') return; var demo = document.getElementById('DemoImg');
demo.style.display = '';
var ex, ey;
var jmg = demo.childNodes[0];
jmg.src = img.src; ex = document.body.scrollLeft + window.event.clientX;
ey = document.body.scrollTop + window.event.clientY - jmg.height - 20;
demo.style.left = String(ex) + 'px';
demo.style.top = String(ey) + 'px';
}
function CopyImage(img)
{
if (img.tagName != 'IMG') return;
if (typeof img.contentEditable == 'undefined') return;
if (!document.body.createControlRange) return;
var ctrl = document.body.createControlRange();
img.contentEditable = true;
ctrl.addElement(img);
ctrl.execCommand('Copy');
img.contentEditable = false;
alert('复制完成,到QQ对话框里按Ctrl+V就可以啦!');
}
function SaveImage(img)
{
var win = document.getElementById('saveform').contentWindow;
if (img.tagName != 'IMG') return;
win.location.href = img.src;
setTimeout(function() { win.document.execCommand("SaveAs"); }, 100);
}function SetStyle(id)
{
var es = document.form2.elements;
var en = document.form2.elements.length;
var ev = id;
for (var i = 0; i < en; i++)
{
if (es[i].type != 'radio') continue;
if (es[i].value == ev)
{
es[i].checked = true;
break;
}
}
document.form2.zi.focus();
}
</script>
<img id="show" src="http://www.csdn.net/images/newcsdnlogo.gif" border="0" onload="if(this.width>700) {this.alt=this.title; this.width=700;}">
<br><img src="images/copyimg.gif" alt="复制图片,可以复制到您的电脑,或直接复制到你的QQ中" width="80" height="25"onClick="CopyImage(document.getElementById('show'))">
现有代码,只能复制当前页面id="show"的缩略图请问如何修改,才能复制大图呢?(就是点击小图后显示的大图)源代码如下:
==========================<script type="text/javascript">function OutDemo(img)
{
if (navigator.appVersion.indexOf("MSIE") == -1) return;
var demo = document.getElementById('DemoImg');
demo.style.display = 'none';
}function OverDemo(img)
{
if (navigator.appVersion.indexOf("MSIE") == -1) return;
if (img.alt == '') return; var demo = document.getElementById('DemoImg');
demo.style.display = '';
var ex, ey;
var jmg = demo.childNodes[0];
jmg.src = img.src; ex = document.body.scrollLeft + window.event.clientX;
ey = document.body.scrollTop + window.event.clientY - jmg.height - 20;
demo.style.left = String(ex) + 'px';
demo.style.top = String(ey) + 'px';
}
function CopyImage(img)
{
if (img.tagName != 'IMG') return;
if (typeof img.contentEditable == 'undefined') return;
if (!document.body.createControlRange) return;
var ctrl = document.body.createControlRange();
img.contentEditable = true;
ctrl.addElement(img);
ctrl.execCommand('Copy');
img.contentEditable = false;
alert('复制完成,到QQ对话框里按Ctrl+V就可以啦!');
}
function SaveImage(img)
{
var win = document.getElementById('saveform').contentWindow;
if (img.tagName != 'IMG') return;
win.location.href = img.src;
setTimeout(function() { win.document.execCommand("SaveAs"); }, 100);
}function SetStyle(id)
{
var es = document.form2.elements;
var en = document.form2.elements.length;
var ev = id;
for (var i = 0; i < en; i++)
{
if (es[i].type != 'radio') continue;
if (es[i].value == ev)
{
es[i].checked = true;
break;
}
}
document.form2.zi.focus();
}
</script>
<img id="show" src="http://www.csdn.net/images/newcsdnlogo.gif" border="0" onload="if(this.width>700) {this.alt=this.title; this.width=700;}">
<br><img src="images/copyimg.gif" alt="复制图片,可以复制到您的电脑,或直接复制到你的QQ中" width="80" height="25"onClick="CopyImage(document.getElementById('show'))">
当点击后直接弹出大图例如:http://www.123.com/Pic/2008-10/B282246138341572.gif
或者也可以改成b.asp页面显示
<a href=***.jpg><img id="show" src="http://www.csdn.net/images/newcsdnlogo.gif" border="0" onload="if(this.width>700) {this.alt=this.title; this.width=700;}"></a>
代码用function CopyImage(img)
{
if (img.tagName != 'IMG') return;
if (typeof img.contentEditable == 'undefined') return;
if (!document.body.createControlRange) return;
var ctrl = document.body.createControlRange();
img.parentNode.contentEditable = true;
ctrl.addElement(img.parentNode);
ctrl.execCommand('Copy');
img.parentNode.contentEditable = false;
alert('复制完成,到QQ对话框里按Ctrl+V就可以啦!');
}
先说明一下 我还没系统的学过JScript 只是在做ASP的时候接触过一些
望老大赐教
你复制得到的结果不能帖在QQ里面的
如果单纯是<IMG id="show" src="http://www.csdn.net/images/newcsdnlogo.gif" onload="if(this.width>700) {this.alt=this.title; this.width=700;}" border="0" name="show">这个可以添在QQ里
加了连接就添不上了
<a href="http://avatar.profile.csdn.net/6/8/D/2_BlueDestiny.jpg"><img src="http://www.csdn.net/images/newcsdnlogo.gif" name="show" border="0" id="show" onload="if(this.width>700) {this.alt=this.title; this.width=700;}"></a>
<br><img src="images/copyimg.gif" alt="复制图片,可以复制到您的电脑,或直接复制到你的QQ中" width="80" height="25"onClick="CopyImage(document.getElementById('show'))">
<img id="imgCache" src="#" style=";visibility:hidden;" />JS的代码改一下。
注意这里只是一个示意,用来说明怎么做。
实际实现的时候,你需要判断imgCache的readyState="complete"之后再进行拷贝操作。
另外,隐藏的图片的属性你也需要改一下。
你自己实现吧,我懒得做了。
function CopyImage(img)
{
imgCache.src = img.parentNode.href;
if (img.tagName != 'IMG') return;
if (typeof img.contentEditable == 'undefined') return;
if (!document.body.createControlRange) return;
var ctrl = document.body.createControlRange();
imgCache.contentEditable = true;
ctrl.addElement(imgCache);
ctrl.execCommand('Copy');
img.contentEditable = false;
alert('复制完成,到QQ对话框里按Ctrl+V就可以啦!');
}