473,320 Members | 1,814 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Change image of imagebutton

Hi gurus,
I have a imagebutton in my WebForm, and I want that when I click (mouse
down) on her the imagebutton change image and when I "unclick" (mouse up)
change to the original image.
Basically I want to know how can I have the mousedown and mouseup buttons
events. I think that I have to do this in JavaScript.

Can you help me on this?

--
Programming ASP.NET with VB.NET
Thank's (if you try to help me)
Hope this help you (if I try to help you)
ruca
Nov 18 '05 #1
6 22092
yes. the best way to achieve is to write a simple javascript method and
change the image url.

Av.
"ruca" <ru***@iol.pt> wrote in message
news:ut*************@TK2MSFTNGP11.phx.gbl...
Hi gurus,
I have a imagebutton in my WebForm, and I want that when I click (mouse
down) on her the imagebutton change image and when I "unclick" (mouse up)
change to the original image.
Basically I want to know how can I have the mousedown and mouseup buttons
events. I think that I have to do this in JavaScript.

Can you help me on this?

--
Programming ASP.NET with VB.NET
Thank's (if you try to help me)
Hope this help you (if I try to help you)
ruca

Nov 18 '05 #2
Right. My question is how??????????????????????????????????
JavaScript it's not my strong....
--
Programming ASP.NET with VB.NET
Thank's (if you try to help me)
Hope this help you (if I try to help you)
ruca

"avnrao" <av*@newsgroups.com> escreveu na mensagem
news:OM**************@TK2MSFTNGP09.phx.gbl...
yes. the best way to achieve is to write a simple javascript method and
change the image url.

Av.
"ruca" <ru***@iol.pt> wrote in message
news:ut*************@TK2MSFTNGP11.phx.gbl...
Hi gurus,
I have a imagebutton in my WebForm, and I want that when I click (mouse
down) on her the imagebutton change image and when I "unclick" (mouse up) change to the original image.
Basically I want to know how can I have the mousedown and mouseup buttons events. I think that I have to do this in JavaScript.

Can you help me on this?

--
Programming ASP.NET with VB.NET
Thank's (if you try to help me)
Hope this help you (if I try to help you)
ruca


Nov 18 '05 #3
ruca <ru***@iol.pt> typed:
Right. My question is how??????????????????????????????????
JavaScript it's not my strong....


Put this in your aspx page

<script language='javascript'>
<!--
function EvImageOverChange(name, direction)
{
switch(direction)
{
case 'in':
name.src = "image/OverImage.gif";
break;
case 'out':
name.src = "image/InitialImage.gif";
break;
}
}
//-->
</script>

in the code behind insert this in the Page load method:

if(!IsPostBack)
{
myImageButton.ImageUrl = "image/InitialImage.gif";
myImageButton.Attributes["OnMouseOver"] =
"javascript:EvImageOverChange(this, 'in');";
myImageButton.Attributes["OnMouseOut"] =
"javascript:EvImageOverChange(this, 'out');";
}

where myImageButton is your WebControls of type ImageButton,
InitialImage.gif is you initial image and OverImage.gif is the image
displayed when the OnMouseOver event is fired.

HTH

--
Davide Vernole
MVP ASP/ASP.NET
Microsoft Certified Solution Developer
Nov 18 '05 #4
David,

What I need to know is how to change the image on the imagebutton
to simulate the button being pressed down just before the postback
event is fired. I used the script below to change the image on the
MouseDown event (client side), but instead of changing the image to
the "button presed" image, the button disappeared just before the
postback event was fired. Why would that happen?? Or is there an
order to the events firing that I'm not aware of?

Any assistance would be gratefully appreciated.

Prescott ...

"Davide Vernole [MVP]" <da****@online.knodev.com> wrote in message news:<e2**************@TK2MSFTNGP15.phx.gbl>...
ruca <ru***@iol.pt> typed:
Right. My question is how??????????????????????????????????
JavaScript it's not my strong....


Put this in your aspx page

<script language='javascript'>
<!--
function EvImageOverChange(name, direction)
{
switch(direction)
{
case 'in':
name.src = "image/OverImage.gif";
break;
case 'out':
name.src = "image/InitialImage.gif";
break;
}
}
//-->
</script>

in the code behind insert this in the Page load method:

if(!IsPostBack)
{
myImageButton.ImageUrl = "image/InitialImage.gif";
myImageButton.Attributes["OnMouseOver"] =
"javascript:EvImageOverChange(this, 'in');";
myImageButton.Attributes["OnMouseOut"] =
"javascript:EvImageOverChange(this, 'out');";
}

where myImageButton is your WebControls of type ImageButton,
InitialImage.gif is you initial image and OverImage.gif is the image
displayed when the OnMouseOver event is fired.

HTH

Nov 18 '05 #5
It might be that IE stops loading images once a new page request (such as a
postback) occurs. You could use the interval timer in client-side code to
cause a delay before the postback by returning false to prevent the form
being submitted and then calling the submit method in your code. But this
will break the page if the user has scripting disabled or not supported. You
might find some useful client-side scripting tricks like this at:
http://www.daveandal.net/books/6744/samples.aspx
Nov 18 '05 #6
what you are trying to do is difficult.

when you set src="images/buttonPressed.gif", you are telling the browser to
download a new image are change the display of the object. when the object
is a imagebutton, the onclick is firing a postback, which is also a download
request. becuase the main page is being replaced, the gif download is
canceled.

to do what you want if you really want to:

1) precache the "button pressed image"

<script>
var imgButtonPressed = new Image ();
imgButtonPressed.src = "images/buttonPressed.gif";
</script>

2) on the image buttons click cancel the postback, change the image and
queue up a new submit.

<script>
function onClick(e)
{
if (e.src != img.src) {
e.src = img.src; // use cached image
var s = "document.getElementById('" + e.id + "').click()";
window.setTimeout(s,10); // give enough time to display
image before real postback
return false;
}
return true;
}
</script>

3) in the code behind, add the onclick handler

button.Attributes.Add("onclick","return onClick(this);")

-- bruce (sqlwork.com)

"Prescott Chartier" <pc*******@yahoo.com> wrote in message
news:87**************************@posting.google.c om...
David,

What I need to know is how to change the image on the imagebutton
to simulate the button being pressed down just before the postback
event is fired. I used the script below to change the image on the
MouseDown event (client side), but instead of changing the image to
the "button presed" image, the button disappeared just before the
postback event was fired. Why would that happen?? Or is there an
order to the events firing that I'm not aware of?

Any assistance would be gratefully appreciated.

Prescott ...

"Davide Vernole [MVP]" <da****@online.knodev.com> wrote in message

news:<e2**************@TK2MSFTNGP15.phx.gbl>...
ruca <ru***@iol.pt> typed:
Right. My question is how??????????????????????????????????
JavaScript it's not my strong....


Put this in your aspx page

<script language='javascript'>
<!--
function EvImageOverChange(name, direction)
{
switch(direction)
{
case 'in':
name.src = "image/OverImage.gif";
break;
case 'out':
name.src = "image/InitialImage.gif";
break;
}
}
//-->
</script>

in the code behind insert this in the Page load method:

if(!IsPostBack)
{
myImageButton.ImageUrl = "image/InitialImage.gif";
myImageButton.Attributes["OnMouseOver"] =
"javascript:EvImageOverChange(this, 'in');";
myImageButton.Attributes["OnMouseOut"] =
"javascript:EvImageOverChange(this, 'out');";
}

where myImageButton is your WebControls of type ImageButton,
InitialImage.gif is you initial image and OverImage.gif is the image
displayed when the OnMouseOver event is fired.

HTH

Nov 18 '05 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: Ester | last post by:
Instead of drag and drop image button from Toolbox and name the image button id on the properties box, I would like to load image button ID from database. I created a database table that stores...
1
by: Holly | last post by:
Hi, I have a page (A) that allows users to enter addresses and displays direction information and map images. The page A calls Microsoft's mappoint web service, gets the route info and map image....
4
by: Andy G | last post by:
I am tring to loop through a dataset to find records that exist. If the record exists then make the corresponding image visible. So I try to take the row value and concatenate it onto a string...
3
by: jens.buchta | last post by:
Hi! I'm using a DataGrid with a template column to display an Image inside of it. I'm hooking into its OnPrerender-Event to set the ImageURL-Property dynamically. Everything works just fine...
5
by: Varangian | last post by:
Hi there experts, Is there a way to convert a System.Drawing.Image to an ImageButton. Maybe using ChangeType I don't know! Thank you
10
by: Edwin Knoppert | last post by:
I have an asp.net imagebutton with a clickevent. I have enclosed an anchor around the image and a small text. If i click the image the event is executed (while the href of the anchor shows in the...
1
by: Brett Wesoloski | last post by:
I am having problems getting the index of an image click event in a datagrid. Every time I look at the index it is -1. What I am trying to do is get the index of the row in which the imagebutton...
4
by: vamshiv | last post by:
hi...im working on asp.net with VB i have created a database which hav fields id,name,image path in web form i hav written code for creation of image buttons dynamically i hav connected the form...
3
by: Ganesh | last post by:
Hi There, Could you some tell me the difference between Image and ImageButton, which one do i need to use if i want to show some picture on the html Thanks Ganapathi
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.