onclick 在弹出框中显示图像

发布于 2024-11-16 08:43:02 字数 474 浏览 3 评论 0原文

我制作了一个简单的画廊，使用这个脚本来显示图像：

 $rs = mysql_query('SELECT * FROM images WHERE oferta_id=2');


 while($row = mysql_fetch_array($rs))
  {
        echo '<li onclick="Large()"><img src='.$row['location'].' alt="image"/></li>';

  }

并且我想以一种方式使用javascript，当用户单击某个图片时，会弹出一个框，他会看到更大的图片。我想我在在

标记中使用 onclick 的正确方法，但几乎不知道如何创建 Large() 函数。有帮助吗关于主题？

谢谢勒伦

原文

I made a simple gallery, using this script to show the images:

 $rs = mysql_query('SELECT * FROM images WHERE oferta_id=2');


 while($row = mysql_fetch_array($rs))
  {
        echo '<li onclick="Large()"><img src='.$row['location'].' alt="image"/></li>';

  }

and I want to use javascript in a way that when an user click on a certain picture a box pops-up and he sees the picture larger.I think I'm on a right way using onclick in the <li> tag, but have almost no idea how to make the Large() function.Any help on the topic?

Thanks

Leron

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

梦回梦里 2024-11-23 08:43:02

你可以给每个<图像>一个递增的数字 ID，并将其传递给 Large 函数，即

onclick="Large(0)"

每个图像都

<img id="image_0" .... />

可以在 Large 函数中获得对该特定图像的唯一引用。

即

function Large(index){
  var image = document.getElementById('image_' + index);
  //your code here
};

或如已经建议的那样，您可以使用灯箱。

另外，另一种选择是仅将 onclick 处理程序添加到图像并传递它，然后您也可以直接引用图像，并删除中间人。
即

<img onclick="Large(this) .... />

只是一些值得深思的东西

You could give each < img > an incrementing numeric id, and be passing that to the Large function, i.e.

onclick="Large(0)"

and each image would be

<img id="image_0" .... />

so that you can get a unique reference to that particular image within the large function.

i.e.

function Large(index){
  var image = document.getElementById('image_' + index);
  //your code here
};

or as has already been suggested, you can use lightbox.

Also, another option is to just add the onclick handler the image and pass this, and then you have a direct reference to the image as well, and cut out the middle man, as it were.
i.e.