Mouse over regions

[Mark Denardo]

Ok here's my problem: I have a large number of pages that each contain a
large image that when a user mouses over a specific region of the image I
need that section of it to show a new image (essentially highlighting the
area with a border and some bold text). I have it working fine using
imagebuttons, but my problem is that in order to create the image buttons, I
have to crop the large image file into smaller regions in Photoshop to make
image buttons and then calculate where on the page each image goes, etc.
etc. A lot of work that I would like to avoid.

My ideal solution, if such a thing exists, is to just be able to create hot
spot regions on parts of the main image and when a user moves over the hot
spot region it will trigger some code (ideally on the client side) and have
the main image change to show the highlighted region (essentially
eliminating the necessity of say an image button).

I played around some with imagemaps, but it doesn't seem to contain any
onmouseover properties.

Any experts out there know a slicker way to handle what I want to do?

Mark

[Scott M.]

Image Maps are exactly what you want to do. Just add the onMouseOver
attribute and then your client-side code to the <AREAtags.
"Mark Denardo" <ma**@markdenardo.netwrote in message
news:JY******************************@starstream.n et...

Ok here's my problem: I have a large number of pages that each contain a
large image that when a user mouses over a specific region of the image I
need that section of it to show a new image (essentially highlighting the
area with a border and some bold text). I have it working fine using
imagebuttons, but my problem is that in order to create the image buttons,
I have to crop the large image file into smaller regions in Photoshop to
make image buttons and then calculate where on the page each image goes,
etc. etc. A lot of work that I would like to avoid.

My ideal solution, if such a thing exists, is to just be able to create
hot spot regions on parts of the main image and when a user moves over the
hot spot region it will trigger some code (ideally on the client side) and
have the main image change to show the highlighted region (essentially
eliminating the necessity of say an image button).

I played around some with imagemaps, but it doesn't seem to contain any
onmouseover properties.

Any experts out there know a slicker way to handle what I want to do?

Mark

[Mark Denardo]

I get an error when I try to add a property to RectangleHotSpot. Am I
spelling it correct (I cut and pasted the same code I used on the image
button and it worked fine there)

Parser Error Message: Type 'System.Web.UI.WebControls.RectangleHotSpot' does
not have a public property named 'onmouseover'.

Here's my markup code:
<asp:ImageMap ID="ImageMap1" runat="server" Style="left: 100px; position:
absolute; top: 200px"

ImageUrl="~/Images/maps/main.gif" onclick="ImageMap1_Clicked"
width="1073" height="635">

<asp:RectangleHotSpot

Left="0" Top="0" Bottom="334" Right="573"

hotspotmode="PostBack"

postbackvalue="NW"

onmouseover="this.src='../Images/maps/NW.gif'"

onmouseout="this.src='../Images/maps/main.gif'"

/>


</asp:ImageMap>
"Scott M." <s-***@nospam.nospamwrote in message
news:eR**************@TK2MSFTNGP02.phx.gbl...

Image Maps are exactly what you want to do. Just add the onMouseOver
attribute and then your client-side code to the <AREAtags.
"Mark Denardo" <ma**@markdenardo.netwrote in message
news:JY******************************@starstream.n et...

>Ok here's my problem: I have a large number of pages that each contain a
large image that when a user mouses over a specific region of the image I
need that section of it to show a new image (essentially highlighting the
area with a border and some bold text). I have it working fine using
imagebuttons, but my problem is that in order to create the image
buttons, I have to crop the large image file into smaller regions in
Photoshop to make image buttons and then calculate where on the page each
image goes, etc. etc. A lot of work that I would like to avoid.

My ideal solution, if such a thing exists, is to just be able to create
hot spot regions on parts of the main image and when a user moves over
the hot spot region it will trigger some code (ideally on the client
side) and have the main image change to show the highlighted region
(essentially eliminating the necessity of say an image button).

I played around some with imagemaps, but it doesn't seem to contain any
onmouseover properties.

Any experts out there know a slicker way to handle what I want to do?

Mark

[Scott M.]

Do it in your code behind:

ImageMap1.attributes.add("onclick", "ImageMap1_Clicked")

"Mark Denardo" <ma**@markdenardo.netwrote in message
news:Fa******************************@starstream.n et...

>I get an error when I try to add a property to RectangleHotSpot. Am I
spelling it correct (I cut and pasted the same code I used on the image
button and it worked fine there)

Parser Error Message: Type 'System.Web.UI.WebControls.RectangleHotSpot'
does not have a public property named 'onmouseover'.

Here's my markup code:
<asp:ImageMap ID="ImageMap1" runat="server" Style="left: 100px; position:
absolute; top: 200px"

ImageUrl="~/Images/maps/main.gif" onclick="ImageMap1_Clicked"
width="1073" height="635">

<asp:RectangleHotSpot

Left="0" Top="0" Bottom="334" Right="573"

hotspotmode="PostBack"

postbackvalue="NW"

onmouseover="this.src='../Images/maps/NW.gif'"

onmouseout="this.src='../Images/maps/main.gif'"

/>


</asp:ImageMap>
"Scott M." <s-***@nospam.nospamwrote in message
news:eR**************@TK2MSFTNGP02.phx.gbl...

>Image Maps are exactly what you want to do. Just add the onMouseOver
attribute and then your client-side code to the <AREAtags.
"Mark Denardo" <ma**@markdenardo.netwrote in message
news:JY******************************@starstream. net...

>>Ok here's my problem: I have a large number of pages that each contain
a large image that when a user mouses over a specific region of the
image I need that section of it to show a new image (essentially
highlighting the area with a border and some bold text). I have it
working fine using imagebuttons, but my problem is that in order to
create the image buttons, I have to crop the large image file into
smaller regions in Photoshop to make image buttons and then calculate
where on the page each image goes, etc. etc. A lot of work that I would
like to avoid.

My ideal solution, if such a thing exists, is to just be able to create
hot spot regions on parts of the main image and when a user moves over
the hot spot region it will trigger some code (ideally on the client
side) and have the main image change to show the highlighted region
(essentially eliminating the necessity of say an image button).

I played around some with imagemaps, but it doesn't seem to contain any
onmouseover properties.

Any experts out there know a slicker way to handle what I want to do?

Mark