我的HTML页面有几个很大的数据。
所以我想要的操作是,我的HTML中的缩略图图像,当用户点击时,会打开一个带有图像的新标签,图标题和文字(例如caption ="这是我的标题")。
但是,我不希望拥有一堆包含我所有数据的新HTML页面,而不想要拥有一堆小而全的图片。相反,我想要一些"更清洁"
我的下面的代码有一个图形(原始大小),但是将图像显示为缩略图,当您单击时,它会在新选项卡中打开图形。
是否有一种简单的方法来添加我的标题文本(并允许我将其重复用于我的所有数字和标题)?
<a href='#' onClick=window.open('js/Figures/BI_Figure1.png','_blank');>
<img src='js/Figures/BI_Figure1.png' alt="thumb" width=100px;height=100px/>
</a>
答案 0 :(得分:2)
我不得不写一个可以处理这个
的Javascript函数该功能如下:
function imagePopup(myImage, myTitle, myCaption, mySource) {
var myWindow = window.open("", myTitle, "_blank", "toolbar=no,scrollbars=no,resizable=yes");
myWindow.document.write("<head><title>" + myTitle + "</title></head>");
myWindow.document.write("<big><b>Figure Caption:</big></b>" + myCaption + "<p>");
myWindow.document.write("<big><b>Figure Source:</big></b>" + mySource + "<p>");
myWindow.document.write("<img src=" + myImage + ">");
return myWindow;
};
然后当我想使用它时,我称之为:
<a href="#" onClick=imagePopup('PATH_TO_FIGURE','FIGURE_TITLE','FIGURE_CAPTION','FIGURE_SOURCE');><img src="PATH_TO_FIGURE" alt="thumb" width=100px;height=100px/></a>
PS - 正在使用所有'
,因为代码嵌入在JSON数组中