[prev in list] [next in list] [prev in thread] [next in thread] 

List:       cgi-list
Subject:    Re: [CGI] http header
From:       "Thomas Butler" <tommy () stealthaccess ! net>
Date:       2000-08-29 8:37:49
[Download RAW message or body]

Hey Shawn, that's really quite easy.  Just place the image on your page
which you want to act as the submit button, and give it a border of 0
(<img...border="0">.  Next you'll want to wrap it in an href tag (trust me)
so it will work in both IE and Netscape.  Now write your href tag so that it
hands over its action to a javascript function called superbutton(), for
example.

Try this example code to get you started, and email me personally if you
have any more DHTML questions, it's my specialty, but not really the theme
of this mailing list..  If this help isn't enough, please send me the
complete page source or a link along with a detailed description of what you
want to happen with your page.  I have no problem with personally directed
questions like this, but take care to watch what you are asking for on this
list.  We have some great members, and from what I've experienced, we try to
keep the list as cleanly on-topic as we can.

        BEGIN EXAMOPLE CODE:

<a href="javascript: superbutton()" onmouseover="swapbutton()"
onmouseout="swapbutton()">
<img name="myButton" src="images/buttonOff.gif"></a>

<script language="JavaScript">
<!--
function superbutton(){

// write in your forms validation sequence here...
// and if the validation returns true, hand off
// the form to JavaScript:

document.forms[0].submit()
}

// here we will create a function that looks to
// see which image is being displayed as the
// submit button, and will swap out the image
// so it displays the one you want onmouseover
// and swap it back onmouseout...
// ...consider precaching both images into the browser's
// memory with JavaScript so the pictures you want to swap
// will be there right away when your button is moused-over
// for the first time.  Let me know if you need help.

function swapbutton(src){
if (document.images["myButton"].src=="images/buttonOff.gif"){
document.images["myButton"].src="images/buttonOn.gif" }
else if (document.images["myButton"].src=="images/buttonOn.gif"){
document.images["myButton"].src="images/buttonOff.gif" }
}
// -->
</script>


----- Original Message -----
From: "shawn" <shawn@bransonwebzine.com>
To: "Thomas Butler" <webdesign@tommybutler.com>; <cgi-list@jann.com>
Sent: Monday, August 28, 2000 9:27 PM
Subject: Re: [CGI] http header


> The problem I am having is with the submit button, even if you use the
image
> source, I can not do a mouse over to change not only the button, but other
> items on the page.
>
> I want to be able to have a graphic laid down on the page, change to
> highlight it when moused over, and change another picture with a preview
of
> what the category is (and all go back to original when moused out).  I
> looked at the onFocus, onClick, and onBlur, but these do me no good since
I
> just want a onMouseOver.  I have tried many things in HTML and JavaScript,
> all to no avail.  Is it possible to have a 'dynamic' button with a form?
Is
> it possible to have a link (regular text or image link) change form
> variables and then force a submit based on these changes?  Maybe I am
making
> this more difficult than need be...
>
> My variables are not sensitive in nature, I just think it looks awfully
> cluttered with a URL that is over 100 characters long.
>
> TIA,
> Shawn

-----------------------------------------------------------------
To unsubscribe, send mail to "majordomo@jann.com" with "unsubscribe cgi-list"
in the body.

CalendarPlus v3.0 with JavaPlus is available NOW!
http://www.calendarplus.com/

The CGI Tips & Tricks website (and archive of the list) is located
at http://perl.jann.com/
-----------------------------------------------------------------

[prev in list] [next in list] [prev in thread] [next in thread]