是否有在只使用JS的情况下弹新页面来显示一张网页上已有的图片?如何实现?
事情是这样的:我正在新尝试的web应用中,我在弹出的模态框中展示了一张从PHP获取到地址的头像,然而页面给头像留的位置太小,有些细节并不能看到,但随意放大又会影响布局……...
事情是这样的:
我正在新尝试的web应用中,我在弹出的模态框中展示了一张从PHP获取到地址的头像,然而页面给头像留的位置太小,有些细节并不能看到,但随意放大又会影响布局……于是我希望能够通过使用JS代码实现在点击图片是能弹一个新页面或标签页来展示这张图片
P.S. 所有需要的数据都已经在页面上了,我实在不想再让这个弹页面从PHP里过一次了,会很烦,而且这个应用就拿自己的笔记本玩玩……并不想再让WAMP再占我本来就不多的硬件资源【虽然浏览器就占得更多了…… 展开
我正在新尝试的web应用中,我在弹出的模态框中展示了一张从PHP获取到地址的头像,然而页面给头像留的位置太小,有些细节并不能看到,但随意放大又会影响布局……于是我希望能够通过使用JS代码实现在点击图片是能弹一个新页面或标签页来展示这张图片
P.S. 所有需要的数据都已经在页面上了,我实在不想再让这个弹页面从PHP里过一次了,会很烦,而且这个应用就拿自己的笔记本玩玩……并不想再让WAMP再占我本来就不多的硬件资源【虽然浏览器就占得更多了…… 展开
1个回答
展开全部
这头像多大啊一个页面显示不完……
举个简单例子吧,题主参考着自行修改:
<!-- a.html -->
<html>
<head>
</head>
<body>
<div id="photo" style="width: 100px; height: 100px; background-image: url(data:image/png;base64,R0lGODlhBAABAIABAMLBwfLx8SH5BAEAAAEALAAAAAAEAAEAAAICRF4AOw==);" onclick="window.open('b.html');"></div>
</body>
</html>
<!-- b.html -->
<html>
<head>
</head>
<body>
<div id="photo" style="width: 100px; height: 100px;"></div>
<script>
window.onload = function() {
document.getElementById("photo").style.backgroundImage = window.opener.document.getElementById("photo").style.backgroundImage;
}
</script>
</body>
</html>
因为用了 window.opener 这个对象,所以需要放到服务器下去访问,不要直接双击本地文件。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询