Is it possible to create an alert box to appear when an image is clicked using HTML?

  • Thread starter Thread starter kyle
  • Start date Start date
K

kyle

Guest
Hello, I want to make a website where, when an image is clicked, an alert box about that image appears to tell the visitor about it, and contain some information about the image. I know how to make an alert box appear using a button, but rather then use a button I'd prefer to use an image.

Is this possible to do?

Many thanks.
Also, I forgot to say I would like to use mapping, using a single image, but depending on where is clicked, a different pop up box appears. Sorry I forgot to mention that.
 
Create a link on the image, and <a href="javascript:;" onclick= "alert('ALERT, THIS IS A MESSAGE')" />

Get it? onclick is the js handled when the link is clicked.
 
Yes you can do by calling javascript , on click of the image you can call javascript from there you can call alert.

<img src="map.gif" onClick="callFunction()" />

In callFunction write logic of alert.

In the below code just give your image location thats it

<html>
<head>
<script type="text/javascript">
function hello()
{
alert("sss");
}
</script>

</head>
<body>
Hello
<img src="C:\Documents and Settings\tkartik\Desktop\Nalco Kartik\w.bmp" onClick="hello()" />

</body>
</html>


This is working
 
Yes you can. In the <img> tag which we commonly use in putting images in our page, it supports an event called onclick. used like:

<img src="yourfile.jpg" onclick="put a script event here">

Your event script can be any script that you want to use. I suggest you use javascript because it is easier. Declare a function of javascript :

<script type="text/javascript">
function nameoffunction()
{
alert("you want to show");
}
</script>

nameoffunction is the name of your function.On the "you want to show", you put your desired message inside the quotation mark. by the way, you must put the script above the <img> tag.

putting it all together, :
<html>
<body>
<script type="text/javascript">
function nameoffunction()
{
alert("you want to show");
}
</script>
<img src="yourfile.jpg" onclick="nameoffunction()">
</body>
</html>

result is your image will be loaded. if you click it, an alert box will pop up, saying (you want to show) message.
 
Yes, it is possible. Look up how to make alert boxes pop up using Javascript. Then, simply insert your function name in the image link (<a href=...>).
 
Back
Top