Formulaire et bouton submit avec image mapée

Version imprimable

Bonjour à tous,

Comme à mon habitude, je cherche à faire une chose peut-être un peu originale, mais je ne pense pas insurmontable.
J'ai une image mappée en pied de page d'un de mes sites. Cette image est mappée en CSS et les liens fonctionnent sans problèmes. Parmis ces liens, il y a celui vers le formulaire de contact, et comme l'adresse du webmaster n'est accessible que depuis les pages du sites faisant appel au gestionnaire de contenu (et donc pas les formulaires), j'ai décidé de mettre en place un formulaire "caché" me permettant de passer la fameuse adresse en paramettre.
J'ai utilisé le code suivant :
Code:

1 2 3 4 <form name="contact" id="contact" method="post" action="contact.php" onsubmit="pp=window.open('', 'pp', 'height=600, width=760, top=0, left=0, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=yes, status=no'); this.target='pp'"> <input type="hidden" name="email_webmaster" id="email_webmaster" value="<? echo $email_webmaster; ?>" /> <input type="image" id="zone_pied2" src="" value="" title="Contact" /> </form>
Ca fonctionne bien, mais le problème c'est que sous IE il y a une croix rouge (image introuvable) et une bordure qui apparaissent au niveau de la partie "contact" de mon image mappée.

Comment puis-je faire pour remédier à cet affichage plus que disgracieux ?

06/12/2004, 12h40
Invité

:salut:

si IE t'affiche une croix rouge, c'est que l'image est non trouvee.
pour eviter la croix rouge, utilise l'attribut alt, qui est censé afficher un texte alternatif en cas d'absence d'image ;-)
06/12/2004, 14h12
dody

Ton idée m'a parue géniale dès que je l'ai lue, mais malheureusement, ça ne fonctionne pas. :(
J'ai essayé ça :

Code:

<input type="image" id="zone_pied2" src="" value="" alt="" title="Contact" />

et aussi ça :

Code:

<input type="image" id="zone_pied2" src="#" value="" alt="" title="Contact" />

et puis aussi ça :

Code:

<input type="image" id="zone_pied2" src="#" value="" alt="" />

Mais y a rien à faire, ma croix rouge apparait toujours.
Si je met une valeur au alt, le texte en question semble s'afficher à coté de la croix (je ne vois pas bien car l'emplacement est un peu petit.)
Saleté d'IE !

Salut

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
// CSS
.shadeInput{
  background:transparent;
  border:0 none #fff;
  cursor:pointer;
}
 
 
// HTML
 
<input type="submit" class="shadeInput" id="zone_pied2" value="" title="Contact" />

@++

06/12/2004, 15h42
dody

Bah ça ne fonctionne pas non plus...
06/12/2004, 15h49
McPeter

???
coment ça ?
tu veux bien avoir un input d'envoi de formulaire mais transparent non ?
d'ou le fait que tu ne mette pas de source à ton type image

comme un type image et un type submit on le même comportement
il suffit d'indiquer via CSS un submit transparent et sans bordure et le tour est joué
ensuite à toi de placer ton input où tu le souhaites ...
Détail : tu veux voir un texte dans celui ci ?
si oui renseignes l'attribut value="texte"

@++
06/12/2004, 15h53
dody

Citation:

Envoyé par dody

Bah ça ne fonctionne pas non plus...

Oula oula, j'ai répondu bien trop vite moi !
Après avoir posté j'ai relu ton code et j'ai vu que j'avais loupé un truc !!! En fait je n'avais pas vu que tu me proposais un input "submit" à la place de mon input "image".
Encore désolée et surtout merci !!! Ca marche impec !!!
06/12/2004, 16h00
McPeter

NON Mé Ô !! :evil:

:wink: :wink: