Onclick event with DIV tag

**ISAIAH** · 03-03-2010

I need to create a simple page which contains an image.It's looks like very simple but not getting succeed to arrange the images.I need to put an image in the middle of the page.whenever,I put the page with the center tag of the HTML it automatically arranged in the top left corner of the page.

How would I control it and need to create an event when a single click made.

Thanks.

**Praetor** · 03-03-2010

If you are working with HTML coding and need to insert an image on the page,its very simple thing.You can use <img scr="name of image file ">.

The center tag,you are using is only for managing the position of text on the pages.you can't set the position of images on the page.

To set the position of image in your page,you need a special tag of the HTML as well as it is widely used by different programming languages to set the position of object in the page.

**Katty** · 03-03-2010

DIV tag

The div tag is used primarily for setting up the position of the objects in the page.It contains some attributed which provides the functionality to the page.

The div tag is defined in the source of the web page as follows-

<div id="xxxx" style="width: 100%; height: 100%; cursor: ? ;">
Insert the object here ..............
</div>

As well defined above,there are some different attributed are being used with this tag and perform different functionality.

**kelfro** · 03-03-2010

You can set up an image between the tags and the images can be controlled anywhere on the page but the attributes should be setup properly.

The attributes of the div tag named position and style would be preferred to control the div section for images.

The following code would be used to set up an image in the middle of the page-

Code:

<div style="text-align: center;">
<img src= "Path of the image file....">
</div>

**Zecho** · 03-03-2010

If you are aware of the functionality of the div tag and the working of attributes then you can use the images and can create an event -

You need to just put the event name in the div tag of the HTML,I am going to create an event named On click for an image in <Div> tag.

Code:

<div onclick="alert( 'Its an event....on a click' );"
style="left:50px;top:50px;position:absolute;background-color:#12d635;width:1
50px;height;450px;">

<img src="D:\Documents and Settings\MINE\My Documents\My Pictures\cbg.jpeg> 
</div>

After execution of this program in browser,you get an image which would be positioned according to the parameter values and when you make a click on that,a alert message would be displayed on the screen.

**Reegan** · 03-03-2010

There are so many events that can be added with a webpage during execution time.You can make a function and call it upon the event in the parameter of the event handler.

I am going to represent a program which will execute a form during the selection of button-

Code:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function valid(form)
{
 //// Codding of function...  
}
</SCRIPT>
</HEAD>
<BODY >
<H3>OnClick Event Handler</H3>
Enter your name and click on the button:<BR>
<form name="myform">
<input type="text" name="data" value="" size=10>
<INPUT TYPE="button" VALUE="Click Here"
onClick="valid(this.form)">
</form>
</BODY>
</HTML>