473,574 Members | 5,361 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

button question

Hi, could anyone please tell me how to make a button look like "being clicked"?
A button picture always looks static, though a link is associated with it.
Thank you.
Jul 23 '05 #1
7 2587
Yaqian Fang wrote on 07 nov 2004 in comp.lang.javas cript:
Hi, could anyone please tell me how to make a button look like "being
clicked"? A button picture always looks static, though a link is
associated with it. Thank you.


<button onclick="this.s tyle.color='red '">
click me and stay red</button>

<button onclick="this.d isabled=true">
click me once only</button>
<button onclick="this.s tyle.borderStyl e='inset';this. disabled=true">
depress me once only</button>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress,
but let us keep the discussions in the newsgroup)

Jul 23 '05 #2
Yaqian Fang wrote:
Hi, could anyone please tell me how to make a button look like "being clicked"?
A button picture always looks static, though a link is associated with it.
Thank you.


Create a "clicked" image and onmousedown change to it. onmouseup change
back.

Fred.
Jul 23 '05 #3
Evertjan. wrote:
Yaqian Fang wrote on 07 nov 2004 in comp.lang.javas cript:
Hi, could anyone please tell me how to make a button look like "being
clicked"? A button picture always looks static, though a link is
associated with it. Thank you.


<button onclick="this.s tyle.color='red '">
click me and stay red</button>

<button onclick="this.d isabled=true">
click me once only</button>

<button onclick="this.s tyle.borderStyl e='inset';this. disabled=true">
depress me once only</button>


Evertjan,

very nice examples. I added a bit of code to the 2nd one:

<button onclick="this.d isabled=true;th is.value='Pleas e Wait...';">clic k
me once only</button>

Mike
Jul 23 '05 #4
mscir wrote on 07 nov 2004 in comp.lang.javas cript:
very nice examples. I added a bit of code to the 2nd one:

<button onclick="this.d isabled=true;th is.value='Pleas e Wait...';">clic k
me once only</button>


Nice idea!

This does work, but it should not, me thinks(...?)
innerHTML seems the way to go.

<button
onclick="this.d isabled=true;th is.innerHTML='P lease Wait...';">
click me once only</button>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress,
but let us keep the discussions in the newsgroup)

Jul 23 '05 #5
Evertjan. wrote:
mscir wrote on 07 nov 2004 in comp.lang.javas cript:
very nice examples. I added a bit of code to the 2nd one:

<button onclick="this.d isabled=true;th is.value='Pleas e Wait...';">clic k
me once only</button>


Nice idea!

This does work, but it should not, me thinks(...?)
innerHTML seems the way to go.

<button
onclick="this.d isabled=true;th is.innerHTML='P lease Wait...';">
click me once only</button>


Good point, I found this with google... it discusses both approaches and
their potential problems, and has code to handle more than one browser:

http://www.permadi.com/tutorial/jsInnerHTMLDOM/

Here's an example using that code, it works on my IE 6, Netscape 7.2,
Moz 1.7.3, Firefox 1.0 pr:

<script type="text/javascript">
function replaceButtonTe xt(buttonId, text){
if (document.getEl ementById) {
var button=document .getElementById (buttonId);
if (button) {
if (button.childNo des[0]) {
button.childNod es[0].nodeValue=text ;
} else if (button.value) {
button.value=te xt;
} else { //if (button.innerHT ML)
button.innerHTM L=text;
}
}
}
}
</script>

<button id="b1" onclick="replac eButtonText('b1 ', 'Please Wait
1...');">click me once only</button>
<br>
<button id="b2" onclick="replac eButtonText('b2 ', 'Please Wait
2...');">click me once only</button>

Mike
Jul 23 '05 #6
Thank you all very much!

mscir wrote on 07 nov 2004 in comp.lang.javas cript:
very nice examples. I added a bit of code to the 2nd one:

<button onclick="this.d isabled=true;th is.value='Pleas e Wait...';">clic k
me once only</button>


Nice idea!

This does work, but it should not, me thinks(...?)
innerHTML seems the way to go.

<button
onclick="this. disabled=true;t his.innerHTML=' Please Wait...';">
click me once only</button>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress,
but let us keep the discussions in the newsgroup)

Jul 23 '05 #7
mscir wrote:
<snip>
<script type="text/javascript">
function replaceButtonTe xt(buttonId, text){
if (document.getEl ementById) {
var button=document .getElementById (buttonId);
if (button) {
if (button.childNo des[0]) {
button.childNod es[0].nodeValue=text ;
} else if (button.value) {
button.value=te xt;
} else { //if (button.innerHT ML)
button.innerHTM L=text;
}
}
}
}
</script>

<button id="b1" onclick="replac eButtonText('b1 ', 'Please Wait
1...');">click me once only</button>


This might work on more browsers, if support for "this" is better than
for getElementById.

function replaceButtonTe xt(btn, text){
//alert('btn.chil dNodes[0] '+btn.childNode s[0]+'\nbtn.value
'+btn.value+'\n btn.innerHTML '+btn.innerHTML );
if (btn.childNodes[0]) {
btn.childNodes[0].nodeValue=text ;
} else if (btn.value) {
btn.value=text;
} else { //if (button.innerHT ML)
btn.innerHTML=t ext;
}
}

<button id="b1" onclick="replac eButtonText(thi s, 'Please Wait
....');">click me once only</button>

Mike
Jul 23 '05 #8

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

Similar topics

13
4744
by: Samantha Smit | last post by:
Hi, I am trying to create a simple asp page that has one command button that updates a database. The URL of the page is like this: http://MyServer.com/Update.asp?UserName=Tom My asp code is like this: %@ Language=VBScript %> <!--#include file="includes/openconnection.asp"-->
2
1695
by: ziggs | last post by:
I have a form that has three text boxes and a command button. For textbox1, I can tab to the next field and enter into that field. If I hit the enter button while I'm in the textbox1 field, it also tabs to next field. However, I want the form to run the code in the Command button instead when the enter button is pressed. How can this be...
2
1073
by: Kevin Blackwell | last post by:
Probably a simple question, but how do I either have a button that is not clickable. I don't want the visual clicking action to the button. Or is there a way to raise so other type of object so that it look raised like a button? Thanks Kevin akblackwel@yahoo.dot.com
0
996
by: VB Programmer | last post by:
I followed this article on creating a rollover button for ASP.NET: http://aspnet.4guysfromrolla.com/articles/091703-1.aspx Question: When I click on the button I would like code-behind to run. Is this possible? If not, do I have to run java-script to process the image button? It is a login button. I need to verify the login/password...
7
2519
by: nathaniel.k.lee | last post by:
Is it not possible, in IE, to dynamically click a radio button? I'm grabbing some values from a database and using them to populate radio buttons on a page. I have alternate code for Firefox browsers using the setAttribute() function. Everything works as planned in Firefox but in IE, the buttons won't populate and, what's worse, I can't...
7
2356
by: David T. Ashley | last post by:
Hi, For a web page, I want a SUBMIT button that commits the form data and a CANCEL button that goes to a different target (i.e. a different script). I haven't figured out how to do this, because the <FORM ACTION="... tag seems to make sure that any two submit controls in a form have to go to the same target. BTW, the CANCEL button does...
0
810
by: Rudy | last post by:
Hello all! I have a quick question. Imported a .gif file that is oval shape for a button, looks great! But when a mouse goes over the button, the outline of the button pops up in a diffrent shade. How can I prevent this from happening, or where can I change the color of the shade? I would just change it to match my background. TIA!!
0
1029
by: Kevin Blount | last post by:
I need to create a page that lists a users Content, and allow them to add subscribers to or remove subscribers from that Content. The list may contain just one Content item, but it could just as easily contain 10 Content items. Each Content item would look something like this: --------------------------------------------- <content title...
2
1058
by: MASREMIND | last post by:
Hi,I'm new on this forum,and I'm new i ASP.net, so I've got question: is it possible in ASP to click on button or to click on LinkButton and when button is clicked on other page program build TextBox (before clicking button TextBox on other page doesent exist),and when user clicks the button 10 times, ten TextBoxes will be shown, if it is...
0
7815
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
8079
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
0
8258
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7833
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
6481
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5635
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
3756
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
1
1359
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
1081
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

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.