10 Replies - 70013 Views - Last Post: 07 March 2006 - 10:28 PM

#1 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Button onClick/onMouseOver Alert Then Go To URL

Post icon  Posted 05 March 2006 - 02:26 PM

OK, here's what I want to happen. I want a button with an image in it, the when you hover mouse over it, a message comes up, then when u click it, another message comes up, then it goes to a site, lol

Little confusing, but I figure it's a simple task for many of the experts here.

here's kinda wut I have so far:
<button><image src="image code"></button>

but I cant find where to put " <a onmouseover="alert(' message ')"></a>

and the <onclick="alert(' message ')"><a href=" link "></a>

sum of theose codes probably aint right for the situation, but plz help me out

and another small thing, I'd like to learn how to make buttons smaller. Once I put an image into a button, it gets huge.

This post has been edited by skyhawk133: 07 March 2006 - 05:28 PM


Is This A Good Question/Topic? 0
  • +

Replies To: Button onClick/onMouseOver Alert Then Go To URL

#2 Amadeus   User is offline

  • g+ + -o drink whiskey.cpp
  • member icon

Reputation: 253
  • View blog
  • Posts: 13,507
  • Joined: 12-July 02

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 05 March 2006 - 04:43 PM

Is it necessary to have the image on a button, or can you simply use the image as a button (mimic the behaviour)? As for the event attributes available to the image tag, you can view them here:
http://www.w3schools...ags/tag_img.asp
Was This Post Helpful? 0
  • +
  • -

#3 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 05 March 2006 - 05:08 PM

thanx, appreciate it
Was This Post Helpful? 0
  • +
  • -

#4 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 05 March 2006 - 05:28 PM

I have an image that u hover mouse over, message comes, then when u click it links, but I'd like a message before it links, can it be done?

Thanx for site, helps tons


:huh:
Was This Post Helpful? 0
  • +
  • -

#5 Arbitrator   User is offline

  • D.I.C Addict
  • member icon

Reputation: 52
  • View blog
  • Posts: 530
  • Joined: 26-January 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 06 March 2006 - 12:25 AM

I've created two versions of this. Hope this helps.

Version #1:
<script type="text/javascript">
function pageConfirm() {
ConfirmStatus = confirm("Use this link?");

if (ConfirmStatus == true) {
  alert("You Ready?");
  alert("Then Let\'s Go!");
  location.href = 'http:\/\/www.dreamincode.net\/';
  }
}
</script>

<img onmouseover='pageConfirm();' src="button.png"/>

Version #2:
<a href="http://www.dreamincode.net/"
  onmouseover="alert('This is a Special Link.');"
  onclick="alert('You Ready?'); alert('Then Let\'s Go!');">
<img src="button.png"/></a>

Note that Version #2 (which is exactly what you asked for) has some problems since you have to close the alert window before you can click; this means that you have to move the mouse to the "OK" button then back to the button at which time you've just activated the onmouseover window all over again. The only way around this is to press the Enter key when you encounter the onmouseover alert (while keeping the cursor over the button) and then click. In Internet Explorer, there appears to be a bug where after the two onclick alerts appear, then the onmouseover alert is presented a second time.

Tested with XHTML 1.1 and J2SE 5.0 U6 in Firefox 1.5 and Internet Explorer 6 SP2.

This post has been edited by Arbitrator: 06 March 2006 - 12:28 AM

Was This Post Helpful? 0
  • +
  • -

#6 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 06 March 2006 - 04:10 PM

thanx so much, dats exactly wut i needed

sorry for asking for more, lol, but I'd like a textbox with 3 rows down and a scrollbar, but the rows won't go to 3, stay at 1. also, I'd like it if I could have a buton, that when you press it, a message appears in the textbox.

This post has been edited by programminglearner: 06 March 2006 - 05:18 PM

Was This Post Helpful? 0
  • +
  • -

#7 Arbitrator   User is offline

  • D.I.C Addict
  • member icon

Reputation: 52
  • View blog
  • Posts: 530
  • Joined: 26-January 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 06 March 2006 - 07:07 PM

Three row text box with a message when a button is clicked:
<script type="text/javascript">
myMessage = "Hello! I'm a box!";
</script>

<form name="testForm">

<textarea name="textBox" rows="3"></textarea><br/>

<input type="button" value="Press Me" onclick="document.testForm.textBox.value = myMessage;"/><input type="reset" value="Clear the Box"/>

</form>

Notes: Firefox appears to be bugged with regards to the "rows" attribute. It adds one more row than necessary, so inputting "3" will get you four rows. Scrollbars will become active (and visible) as soon as the text overflows the box area. When the scrollbars are inactive you'll be able to see them in Internet Explorer but they'll be invisible in Firefox.

I also tried to make the script references using IDs instead of "name" identifiers but couldn't figure out how since I'm not really familiar with Javascript. The "getElementById()" thing really confounds me, heh.

Tested with XHTML 1.1 in Firefox 1.5 and Internet Explorer 6 SP2.
Was This Post Helpful? 0
  • +
  • -

#8 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 06 March 2006 - 07:50 PM

thanx, but where I'm using this , it won't allow <textarea so.... I put <input type="textbox" and then nothing worked, what do I do, how how could I get <input type="textbox" to work with buttons and that
Was This Post Helpful? 0
  • +
  • -

#9 Arbitrator   User is offline

  • D.I.C Addict
  • member icon

Reputation: 52
  • View blog
  • Posts: 530
  • Joined: 26-January 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 06 March 2006 - 09:01 PM

You can't change the the number of rows or add a scrollbar using a normal input text box; it will always be one row high without a scrollbar; all you can do is make it wider or narrower. If you want, you can make the box taller or shorter by altering the font size as shown here...

<input name="textBox" value="Example" style="font-size: 50pt;"/> - or -
<input name="textBox" value="Example" style="font-size: 5pt;"/>

... but the box will still remain one row (of text) high.

Here's the same code for the text area box configured to work with a normal input text box:
<script type="text/javascript">
myMessage = "Hello! I'm a box!";
</script>

<form name="testForm">

<input name="textBox"/><br/>

<input type="button" value="Press Me" onclick="document.testForm.textBox.value = myMessage;"/><input type="reset" value="Clear the Box"/>

</form>

Tested with XHTML 1.1 in Firefox 1.5 and Internet Explorer 6 SP2.

This post has been edited by Arbitrator: 06 March 2006 - 09:31 PM

Was This Post Helpful? 0
  • +
  • -

#10 programminglearner   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 86
  • Joined: 18-December 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 07 March 2006 - 02:21 PM

thanx for trying, but still didn't work, probably the site, dats ok.

does any1 know how to make a prompt that you can say like, if it says "hi" then (do something)

I just cannot figure out how to say "if (prompt)='hi' then (do something)

here's kinda wut I got
[<script language="javascript">
var name=prompt("text","more text"
</script>]

I know... ain't too much, I cannot even get it to come up...

This post has been edited by programminglearner: 07 March 2006 - 03:43 PM

Was This Post Helpful? 0
  • +
  • -

#11 Arbitrator   User is offline

  • D.I.C Addict
  • member icon

Reputation: 52
  • View blog
  • Posts: 530
  • Joined: 26-January 05

Re: Button onClick/onMouseOver Alert Then Go To URL

Posted 07 March 2006 - 10:28 PM

<script type="text/javascript">
userResponse = prompt("Hello. How are you?","")
userResponse = userResponse.toLowerCase();

if (userResponse == "hi" || userResponse == "hiya" || userResponse == "hello") {
  // DO SOMETHING HERE; EXAMPLE:
  alert("Hello to you too! Welcome to the website!");
  }
else if (userResponse == "") {
  // OTHERWISE, DO SOMETHING HERE; EXAMPLE:
  alert("Welcome to the website!");
  }
else {
  // OTHERWISE, DO SOMETHING HERE; EXAMPLE:
  alert("I don't know what that means, but welcome to the website!");
  }
</script>

Quote

thanx for trying, but still didn't work, probably the site, dats ok.

Whoever is hosting your website may have Javascript disabled (or anything with the <script> tag) which might explain why none of this works for you. If this is the case, then you'll have to find a host that does support scripts to be able to use Javascript in your pages.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1