点击事件未在鼠标越来越缩放图像上的同一选项卡/窗口中打开
我正在尝试在同一选项卡/窗口上打开网页，点击缩放图像。我尝试了_ self，但它不起作用。另外，我正在使用Google网站开发一个简单的网站。似乎很容易，但没有得到答案，我无法解决问题。附加我的代码。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
.zoom[href] {
padding: 2px;
transition: transform .3s;
width: 150px;
height: 81px;
margin: 0 auto;
overflow: hidden;
}
.zoom:hover {
-ms-transform: scale(1.3); /* IE 9 */
-webkit-transform: scale(1.3); /* Safari 3-8 */
transform: scale(1.3);
}
::-webkit-scrollbar {
width: 0px; /* remove scrollbar space /
background: transparent; / optional: just make scrollbar invisible /
}
/ optional: show position indicator in red */
::-webkit-scrollbar-thumb {
background: #FF0000;
}
</style>
<script type="text/javascript">
var windowObjectReference = null; // global variable
function openRequestedPopup(url, windowName) {
if(windowObjectReference == null || windowObjectReference.closed) {
windowObjectReference = window.open(url, windowName, "_self");
} else {
windowObjectReference.focus();
};
}
</script>
</head>
<body>
<div class="zoom">
<a href="https://www.google.com" onclick="openRequestedPopup(this.href, this.target); return false;">
<img src="https://via.placeholder.com/250" alt="Our Performance" styles="width:100%">
</a>
</div>
</body>
</html>这是我目前的情况：
这就是我期望的：
I am trying to open a web page on same tab/window on-clicking a zoom-over image. I tried _self but it is not working. Also, I am using Google Sites to develop a simple website. It seems easy but not getting the answer and I'm unable to solve the issue. Attaching my code.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
.zoom[href] {
padding: 2px;
transition: transform .3s;
width: 150px;
height: 81px;
margin: 0 auto;
overflow: hidden;
}
.zoom:hover {
-ms-transform: scale(1.3); /* IE 9 */
-webkit-transform: scale(1.3); /* Safari 3-8 */
transform: scale(1.3);
}
::-webkit-scrollbar {
width: 0px; /* remove scrollbar space /
background: transparent; / optional: just make scrollbar invisible /
}
/ optional: show position indicator in red */
::-webkit-scrollbar-thumb {
background: #FF0000;
}
</style>
<script type="text/javascript">
var windowObjectReference = null; // global variable
function openRequestedPopup(url, windowName) {
if(windowObjectReference == null || windowObjectReference.closed) {
windowObjectReference = window.open(url, windowName, "_self");
} else {
windowObjectReference.focus();
};
}
</script>
</head>
<body>
<div class="zoom">
<a href="https://www.google.com" onclick="openRequestedPopup(this.href, this.target); return false;">
<img src="https://via.placeholder.com/250" alt="Our Performance" styles="width:100%">
</a>
</div>
</body>
</html>This is my current situation:
And this is what i am expecting:
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我的理解是，您打算在用户单击它时打开页面内的弹出窗口。这可以如下：
1。创建一个iframe，
需要创建
iframe这样的您
。
在你的锚点。
My understanding is that you intend to open a popup inside your page when the user is clicking on it. This can be achieved as follows:
1. Create an iframe
You will need to create an
iframelike this:2. Create a function that opens it with a URL
3. Have an onclick that executes it
Something like
in your anchor.