HighDots Forums  

How to use an image map as a form submit button

Macromedia Dreamweaver Macromedia Dreamweaver Discussions (macromedia.dreamweaver)


Discuss How to use an image map as a form submit button in the Macromedia Dreamweaver forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
John Gaver
 
Posts: n/a

Default How to use an image map as a form submit button - 07-02-2004 , 05:05 PM






Challenge: To create a search field in a CSS layer, placed over a layer that
contains a complex header, including the "Go" button.

Background: I have a Fireworks generated header
(http://www.actionamerica.org/huh/), including drop-down menus and a search
field, that appears to work properly, in multiple browsers. However, when I
bring the code for the FW sliced header into DW and try to place it in a layer,
the html that is in two of those slices (the search field and "Go" button),
hoses up the DW image and makes it very difficult to design further, in DW.
Interestingly, the CSS page, with the header in a layer, still displays
properly and the search field works, in the several browsers that I have
checked. The whole reason for this exercise is to be able to place the header
in a layer and have it display properly in DW and in browsers.

My Solution (up to now): I removed the search field from the FW generated
header and took the html out of the "Go" button slice and re-generated the
header. That header displays properly in a DW layer and the menus work in
browsers. I use DW to place the search field html in a layer on top of the
header. This works in DW and browsers.

Problem: I want to create a circular hot spot, in a layer, over the "Go"
button (that is still a part of the header image) and have that hot spot
activate the submit action for the form.

Code: The following code seems to work, up to the point of the line with the
question marks (?????). There are also some additional input fields that are
immaterial to the problem.

<div id="Layer2" style="position:absolute; left:606px; top:46px; width:124px;
height:30px; z-index:2">
<form method="get" action="http://search.atomz.com/search/">
<div align="center"><input size="14" name="sp-q" style="width:120px;"></div>
<input name="submit" type="image" value="Search" ... ????? ...>
<input ...>
<input ...>
</form></div>

I have tried creating an image map named "submit" and tried "usemap" in the
"input" structure, but it seems that, somewhere, I am not coding it right.

Any ideas?

Thanks,
John Gaver
Action America

Microsoft: (n) Job security for IT consultants



Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.