Connecting Tech Pros Worldwide Help | Site Map

How to make control visible/invisible on mouseover.

Selden McCabe
Guest
 
Posts: n/a
#1: Nov 19 '05
I have a form with a bunch of image buttons. When the user moves the mouse
over a button, I want to do two things: 1. change the Imagebutton's picture,
and 2. make another control visible.

I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
'somepicture.jpg')
and that works fine.

I've tried some java script to change the other control's visible property
by changing is className, but that doesn't seem to work

script = "document.GetElementByID('panel1').className = 'vs1';return false;"
iBut.Attributes.Add("onMouseOver", script)

but that gives me a script error on the page when I mouseover the image
button. (I've tried it with and without the return false)

So how do I change the visibility property of a control in javascript, and
then, how do I combine two steps into one onMouseOver?

Thanks!
---Selden <--- java newbie!


Karl Seguin
Guest
 
Posts: n/a
#2: Nov 19 '05

re: How to make control visible/invisible on mouseover.


Just not that the ASP.net generates client-side ids that don't necessarily
match the id of the control. For example, if you could have two user
controls on the same page both containing a textbox named "username".
ASP.Net can't output two <input type="text" tags with the same id (ie,
"username"). Hence it must dynamically generate an id (the name of the
textbox appended to the user control). This might be what's happening.

Or it could simply be that it's getElementById instead of GetElementByID

Try

script = "document.getElementById('" & panel1.ClientId & "').className =
'vs1'; ....."

Karl
--
MY ASP.Net tutorials
http://www.openmymind.net/ - New and Improved (yes, the popup is annoying)
http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
come!)


"Selden McCabe" <seldenm@msn.com> wrote in message
news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...[color=blue]
>I have a form with a bunch of image buttons. When the user moves the mouse
>over a button, I want to do two things: 1. change the Imagebutton's
>picture, and 2. make another control visible.
>
> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
> 'somepicture.jpg')
> and that works fine.
>
> I've tried some java script to change the other control's visible property
> by changing is className, but that doesn't seem to work
>
> script = "document.GetElementByID('panel1').className = 'vs1';return
> false;"
> iBut.Attributes.Add("onMouseOver", script)
>
> but that gives me a script error on the page when I mouseover the image
> button. (I've tried it with and without the return false)
>
> So how do I change the visibility property of a control in javascript, and
> then, how do I combine two steps into one onMouseOver?
>
> Thanks!
> ---Selden <--- java newbie!
>[/color]


Karl Seguin
Guest
 
Posts: n/a
#3: Nov 19 '05

re: How to make control visible/invisible on mouseover.


Just not that the ASP.net generates client-side ids that don't necessarily
match the id of the control. For example, if you could have two user
controls on the same page both containing a textbox named "username".
ASP.Net can't output two <input type="text" tags with the same id (ie,
"username"). Hence it must dynamically generate an id (the name of the
textbox appended to the user control). This might be what's happening.

Or it could simply be that it's getElementById instead of GetElementByID

Try

script = "document.getElementById('" & panel1.ClientId & "').className =
'vs1'; ....."

Karl
--
MY ASP.Net tutorials
http://www.openmymind.net/ - New and Improved (yes, the popup is annoying)
http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
come!)


"Selden McCabe" <seldenm@msn.com> wrote in message
news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...[color=blue]
>I have a form with a bunch of image buttons. When the user moves the mouse
>over a button, I want to do two things: 1. change the Imagebutton's
>picture, and 2. make another control visible.
>
> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
> 'somepicture.jpg')
> and that works fine.
>
> I've tried some java script to change the other control's visible property
> by changing is className, but that doesn't seem to work
>
> script = "document.GetElementByID('panel1').className = 'vs1';return
> false;"
> iBut.Attributes.Add("onMouseOver", script)
>
> but that gives me a script error on the page when I mouseover the image
> button. (I've tried it with and without the return false)
>
> So how do I change the visibility property of a control in javascript, and
> then, how do I combine two steps into one onMouseOver?
>
> Thanks!
> ---Selden <--- java newbie!
>[/color]


Selden McCabe
Guest
 
Posts: n/a
#4: Nov 19 '05

re: How to make control visible/invisible on mouseover.


Hi Karl,

Thanks for the feedback and suggestions.
I tried that script too, but just got a script error when I rolled the mouse
over the button.

I haven't gotten any other suggestions. I wonder if it's possible to write
the routine I want in VB script instead of java? Is it any easier to access
controls on your web page with VB script?

Thanks,
---Selden


"Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
wrote in message news:uVD6kXGSFHA.356@TK2MSFTNGP14.phx.gbl...[color=blue]
> Just not that the ASP.net generates client-side ids that don't necessarily
> match the id of the control. For example, if you could have two user
> controls on the same page both containing a textbox named "username".
> ASP.Net can't output two <input type="text" tags with the same id (ie,
> "username"). Hence it must dynamically generate an id (the name of the
> textbox appended to the user control). This might be what's happening.
>
> Or it could simply be that it's getElementById instead of GetElementByID
>
> Try
>
> script = "document.getElementById('" & panel1.ClientId & "').className =
> 'vs1'; ....."
>
> Karl
> --
> MY ASP.Net tutorials
> http://www.openmymind.net/ - New and Improved (yes, the popup is annoying)
> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
> come!)
>
>
> "Selden McCabe" <seldenm@msn.com> wrote in message
> news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...[color=green]
>>I have a form with a bunch of image buttons. When the user moves the
>>mouse over a button, I want to do two things: 1. change the Imagebutton's
>>picture, and 2. make another control visible.
>>
>> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
>> 'somepicture.jpg')
>> and that works fine.
>>
>> I've tried some java script to change the other control's visible
>> property by changing is className, but that doesn't seem to work
>>
>> script = "document.GetElementByID('panel1').className = 'vs1';return
>> false;"
>> iBut.Attributes.Add("onMouseOver", script)
>>
>> but that gives me a script error on the page when I mouseover the image
>> button. (I've tried it with and without the return false)
>>
>> So how do I change the visibility property of a control in javascript,
>> and then, how do I combine two steps into one onMouseOver?
>>
>> Thanks!
>> ---Selden <--- java newbie!
>>[/color]
>
>[/color]


Karl Seguin
Guest
 
Posts: n/a
#5: Nov 19 '05

re: How to make control visible/invisible on mouseover.


Not really. Perhaps if you showed us what you have thus far?

Karl

--
MY ASP.Net tutorials
http://www.openmymind.net/ - New and Improved (yes, the popup is annoying)
http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
come!)


"Selden McCabe" <seldenm@msn.com> wrote in message
news:e%239HToSSFHA.2604@TK2MSFTNGP10.phx.gbl...[color=blue]
> Hi Karl,
>
> Thanks for the feedback and suggestions.
> I tried that script too, but just got a script error when I rolled the
> mouse over the button.
>
> I haven't gotten any other suggestions. I wonder if it's possible to
> write the routine I want in VB script instead of java? Is it any easier
> to access controls on your web page with VB script?
>
> Thanks,
> ---Selden
>
>
> "Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
> wrote in message news:uVD6kXGSFHA.356@TK2MSFTNGP14.phx.gbl...[color=green]
>> Just not that the ASP.net generates client-side ids that don't
>> necessarily match the id of the control. For example, if you could have
>> two user controls on the same page both containing a textbox named
>> "username". ASP.Net can't output two <input type="text" tags with the
>> same id (ie, "username"). Hence it must dynamically generate an id (the
>> name of the textbox appended to the user control). This might be what's
>> happening.
>>
>> Or it could simply be that it's getElementById instead of GetElementByID
>>
>> Try
>>
>> script = "document.getElementById('" & panel1.ClientId & "').className =
>> 'vs1'; ....."
>>
>> Karl
>> --
>> MY ASP.Net tutorials
>> http://www.openmymind.net/ - New and Improved (yes, the popup is
>> annoying)
>> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
>> come!)
>>
>>
>> "Selden McCabe" <seldenm@msn.com> wrote in message
>> news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...[color=darkred]
>>>I have a form with a bunch of image buttons. When the user moves the
>>>mouse over a button, I want to do two things: 1. change the Imagebutton's
>>>picture, and 2. make another control visible.
>>>
>>> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
>>> 'somepicture.jpg')
>>> and that works fine.
>>>
>>> I've tried some java script to change the other control's visible
>>> property by changing is className, but that doesn't seem to work
>>>
>>> script = "document.GetElementByID('panel1').className = 'vs1';return
>>> false;"
>>> iBut.Attributes.Add("onMouseOver", script)
>>>
>>> but that gives me a script error on the page when I mouseover the image
>>> button. (I've tried it with and without the return false)
>>>
>>> So how do I change the visibility property of a control in javascript,
>>> and then, how do I combine two steps into one onMouseOver?
>>>
>>> Thanks!
>>> ---Selden <--- java newbie!
>>>[/color]
>>
>>[/color]
>
>[/color]


Selden McCabe
Guest
 
Posts: n/a
#6: Nov 19 '05

re: How to make control visible/invisible on mouseover.


Thanks, good suggestion!

Here's what I've tried, what worked and what didn't:

First, there is a panel on the page, "Panel1" if I set it's CssClass to
"vs1" it is visible. If I set it to "vs2" it is invisible. I've confirmed
this several times.

this worked:
sPic3 = "family/purchase/images/portrait_navs/" & sTitle &
"3.gif"
iBut.Attributes.Add("onMouseOver", "this.src='" & sPic3 & "'")

This gave me a script error: (tried with and without the return false):
script = "document.GetElementByID('panel1').className =
'vs1';return false;"
iBut.Attributes.Add("onMouseOver", script)

This also gave me a script error:
script = "document.getElementById('" & Panel1.ClientID &
"').className = 'vs1'; "
iBut.Attributes.Add("onMouseOver", script)

As an aside, setting the panel visible/invisible is a fall back. What I
would REALLY want to do is set the text of a label to any one of 15
different values, depending on what button the mouse is rolling over. Also
I would want to set the image for an image control at the same time. But if
I can't do that, then I thought I would pre-set up 15 different panels with
the values already filled in, and just make one visible at the rollover.

---Selden




"Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
wrote in message news:%23kX2RuSSFHA.248@TK2MSFTNGP15.phx.gbl...[color=blue]
> Not really. Perhaps if you showed us what you have thus far?
>
> Karl
>
> --
> MY ASP.Net tutorials
> http://www.openmymind.net/ - New and Improved (yes, the popup is annoying)
> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
> come!)
>
>
> "Selden McCabe" <seldenm@msn.com> wrote in message
> news:e%239HToSSFHA.2604@TK2MSFTNGP10.phx.gbl...[color=green]
>> Hi Karl,
>>
>> Thanks for the feedback and suggestions.
>> I tried that script too, but just got a script error when I rolled the
>> mouse over the button.
>>
>> I haven't gotten any other suggestions. I wonder if it's possible to
>> write the routine I want in VB script instead of java? Is it any easier
>> to access controls on your web page with VB script?
>>
>> Thanks,
>> ---Selden
>>
>>
>> "Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
>> wrote in message news:uVD6kXGSFHA.356@TK2MSFTNGP14.phx.gbl...[color=darkred]
>>> Just not that the ASP.net generates client-side ids that don't
>>> necessarily match the id of the control. For example, if you could have
>>> two user controls on the same page both containing a textbox named
>>> "username". ASP.Net can't output two <input type="text" tags with the
>>> same id (ie, "username"). Hence it must dynamically generate an id (the
>>> name of the textbox appended to the user control). This might be
>>> what's happening.
>>>
>>> Or it could simply be that it's getElementById instead of GetElementByID
>>>
>>> Try
>>>
>>> script = "document.getElementById('" & panel1.ClientId & "').className =
>>> 'vs1'; ....."
>>>
>>> Karl
>>> --
>>> MY ASP.Net tutorials
>>> http://www.openmymind.net/ - New and Improved (yes, the popup is
>>> annoying)
>>> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
>>> come!)
>>>
>>>
>>> "Selden McCabe" <seldenm@msn.com> wrote in message
>>> news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...
>>>>I have a form with a bunch of image buttons. When the user moves the
>>>>mouse over a button, I want to do two things: 1. change the
>>>>Imagebutton's picture, and 2. make another control visible.
>>>>
>>>> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
>>>> 'somepicture.jpg')
>>>> and that works fine.
>>>>
>>>> I've tried some java script to change the other control's visible
>>>> property by changing is className, but that doesn't seem to work
>>>>
>>>> script = "document.GetElementByID('panel1').className = 'vs1';return
>>>> false;"
>>>> iBut.Attributes.Add("onMouseOver", script)
>>>>
>>>> but that gives me a script error on the page when I mouseover the image
>>>> button. (I've tried it with and without the return false)
>>>>
>>>> So how do I change the visibility property of a control in javascript,
>>>> and then, how do I combine two steps into one onMouseOver?
>>>>
>>>> Thanks!
>>>> ---Selden <--- java newbie!
>>>>
>>>
>>>[/color]
>>
>>[/color]
>
>[/color]


Selden McCabe
Guest
 
Posts: n/a
#7: Nov 19 '05

re: How to make control visible/invisible on mouseover.


I also found another project where something like this is working, so I
copied that script but it wasn't working for me.

Here's what I found, in the aspx page of the other project

onclick='document.forms[0].btnTest.click();'

It looks like this was clicking a button, on the click event of another
control.

So I tried this: (image button ibPkgB is an image button, that, when you
click it, does what I want to happen on a mouse over...)

iBut.Attributes.Add("onMouseOver", "document.forms[0].ibPkgB.click();")

Gave me an error, so I tried:
iBut.Attributes.Add("onMouseOver", "document.ibPkgB.click();")

I checked, and ibPkgB's "ID" and "ClientID" properties are both "ibPkgB" so
it didn't seem worthwhile adding that to the script.

So that's all I've tried so far...

---Selden



"Selden McCabe" <seldenm@msn.com> wrote in message
news:uIv8YETSFHA.1396@TK2MSFTNGP10.phx.gbl...[color=blue]
> Thanks, good suggestion!
>
> Here's what I've tried, what worked and what didn't:
>
> First, there is a panel on the page, "Panel1" if I set it's CssClass to
> "vs1" it is visible. If I set it to "vs2" it is invisible. I've
> confirmed this several times.
>
> this worked:
> sPic3 = "family/purchase/images/portrait_navs/" & sTitle &
> "3.gif"
> iBut.Attributes.Add("onMouseOver", "this.src='" & sPic3 & "'")
>
> This gave me a script error: (tried with and without the return false):
> script = "document.GetElementByID('panel1').className =
> 'vs1';return false;"
> iBut.Attributes.Add("onMouseOver", script)
>
> This also gave me a script error:
> script = "document.getElementById('" & Panel1.ClientID &
> "').className = 'vs1'; "
> iBut.Attributes.Add("onMouseOver", script)
>
> As an aside, setting the panel visible/invisible is a fall back. What I
> would REALLY want to do is set the text of a label to any one of 15
> different values, depending on what button the mouse is rolling over.
> Also I would want to set the image for an image control at the same time.
> But if I can't do that, then I thought I would pre-set up 15 different
> panels with the values already filled in, and just make one visible at the
> rollover.
>
> ---Selden
>
>
>
>
> "Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
> wrote in message news:%23kX2RuSSFHA.248@TK2MSFTNGP15.phx.gbl...[color=green]
>> Not really. Perhaps if you showed us what you have thus far?
>>
>> Karl
>>
>> --
>> MY ASP.Net tutorials
>> http://www.openmymind.net/ - New and Improved (yes, the popup is
>> annoying)
>> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
>> come!)
>>
>>
>> "Selden McCabe" <seldenm@msn.com> wrote in message
>> news:e%239HToSSFHA.2604@TK2MSFTNGP10.phx.gbl...[color=darkred]
>>> Hi Karl,
>>>
>>> Thanks for the feedback and suggestions.
>>> I tried that script too, but just got a script error when I rolled the
>>> mouse over the button.
>>>
>>> I haven't gotten any other suggestions. I wonder if it's possible to
>>> write the routine I want in VB script instead of java? Is it any easier
>>> to access controls on your web page with VB script?
>>>
>>> Thanks,
>>> ---Selden
>>>
>>>
>>> "Karl Seguin" <karl REMOVE @ REMOVE openmymind REMOVEMETOO . ANDME net>
>>> wrote in message news:uVD6kXGSFHA.356@TK2MSFTNGP14.phx.gbl...
>>>> Just not that the ASP.net generates client-side ids that don't
>>>> necessarily match the id of the control. For example, if you could have
>>>> two user controls on the same page both containing a textbox named
>>>> "username". ASP.Net can't output two <input type="text" tags with the
>>>> same id (ie, "username"). Hence it must dynamically generate an id
>>>> (the name of the textbox appended to the user control). This might be
>>>> what's happening.
>>>>
>>>> Or it could simply be that it's getElementById instead of
>>>> GetElementByID
>>>>
>>>> Try
>>>>
>>>> script = "document.getElementById('" & panel1.ClientId & "').className
>>>> = 'vs1'; ....."
>>>>
>>>> Karl
>>>> --
>>>> MY ASP.Net tutorials
>>>> http://www.openmymind.net/ - New and Improved (yes, the popup is
>>>> annoying)
>>>> http://www.openmymind.net/faq.aspx - unofficial newsgroup FAQ (more to
>>>> come!)
>>>>
>>>>
>>>> "Selden McCabe" <seldenm@msn.com> wrote in message
>>>> news:OXPdDUESFHA.1396@TK2MSFTNGP10.phx.gbl...
>>>>>I have a form with a bunch of image buttons. When the user moves the
>>>>>mouse over a button, I want to do two things: 1. change the
>>>>>Imagebutton's picture, and 2. make another control visible.
>>>>>
>>>>> I'm using the Imagebutton.Attributes.Add("onMouseOver","this.src =
>>>>> 'somepicture.jpg')
>>>>> and that works fine.
>>>>>
>>>>> I've tried some java script to change the other control's visible
>>>>> property by changing is className, but that doesn't seem to work
>>>>>
>>>>> script = "document.GetElementByID('panel1').className = 'vs1';return
>>>>> false;"
>>>>> iBut.Attributes.Add("onMouseOver", script)
>>>>>
>>>>> but that gives me a script error on the page when I mouseover the
>>>>> image button. (I've tried it with and without the return false)
>>>>>
>>>>> So how do I change the visibility property of a control in javascript,
>>>>> and then, how do I combine two steps into one onMouseOver?
>>>>>
>>>>> Thanks!
>>>>> ---Selden <--- java newbie!
>>>>>
>>>>
>>>>
>>>
>>>[/color]
>>
>>[/color]
>
>[/color]


Closed Thread