cliquer et faire apparaitre une sous fenêtre

Le premier forum francophone sur l'éditeur de pages Web multiplateforme (Linux, Mac OS X, Windows) qui monte… KompoZer, héritier de Nvu, permet de créer vos pages Web graphiquement (wysiwyg) sans aucune connaissance du langage HTML.

Modérateur : chinon37

quandiris
Arias
Messages : 15
Inscription : 29 déc. 2008, 15:39

cliquer et faire apparaitre une sous fenêtre

Message par quandiris »

J'avance, j'avance dans mon site internet. J'ai fait des tas de choses et je suis assez contente de moi! Exemple une carte du territoire avec des noms clignotants qui quand on clique nous dirige vers le lien!

Mais là je bloque.....

je cherche à faire des boutons avec quand on passe dessus ou quand on clique une "petite" fenêtre qui apparait avec un petit texte. c'est à dire que ma page reste en fond.

Pourriez vous me guider et me dire comment je dois m'y prendre

merci!
quandiris


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.6) Gecko/2009011913 Firefox/3.0.6
Fabrice.Tres.Net
Tyrannosaurus Rex
Messages : 2390
Inscription : 26 juin 2006, 12:50

Message par Fabrice.Tres.Net »

Rapidos.

Tu peux utiliser pour les liens le champ title qui s'affiche au survol.

Sinon il faut regarder avec la propriété css :hover qui permet de faire (ap ou dis)paraître des choses au survol également.
En code cela va donner:

Code : Tout sélectionner

<a class="popupcss" href="..."><span> Texte caché qui n'apparait qu'au survol</span><img src="image.png" /> </a>

En css tu auras qlq chose comme :

a.popupcss  span {
  display: none;
}
a.popupcss:hover  span {
  display: block;
  position: absolute;
  left: 15px
}

[/code]
quandiris
Arias
Messages : 15
Inscription : 29 déc. 2008, 15:39

Message par quandiris »

Merci

oui ça pourrait répondre à ma recherche, je vais essayer!

merci à toi :)

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.6) Gecko/2009011913 Firefox/3.0.6
quandiris
Arias
Messages : 15
Inscription : 29 déc. 2008, 15:39

Message par quandiris »

Bon ben j'y arrive pas!!!!! :oops:

Puis je savoir comment vous faite entre votre CSS et votre HTML
est-ce que vous faites des fichiers séparés!

Moi j'ai codé avec Kompozer, les deux sont dans le même fichier!

Après si on regarde bien on devrait se retrouver avec des fichiers comme quand on code avec Notepad non? La je trouve que ça fait fouilli!

Je veux bien vos expériences et comment vous avez fait pour vous y retrouver? :roll:

:shock: tapez pas, j'suis vraiment novice!!! :roll: :cry:



Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.6) Gecko/2009011913 Firefox/3.0.6
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Message par chinon37 »

le mieux serait que ce soit toi qui envoie ton code: on pourrait voir où tu as fait l'erreur, si erreur il y a...
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
quandiris
Arias
Messages : 15
Inscription : 29 déc. 2008, 15:39

Message par quandiris »

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html
 lang="fr-fr"><head><meta
 content="text/html; charset=ISO-8859-1"
 http-equiv="content-type"><title>Mise en page CSS</title><style
 type="text/css">
#entete {
width: 100%;
}
#menu {
border-style: groove;
border-color: #3333ff;
float: left;
list-style-type: none;
position: absolute;
width: 196px;
background-color: #85b2ff;
list-style-image: url(image/puce.jpg);
list-style-position: inside;
}
#texte {
margin-left: 250px;
}
#pied {
border-style: groove;
border-color: #000099;
clear: left;
background-color: #85b2ff;
position: absolute;
}
</style></head>
<body
 style="margin-top: 0px; height: 675px; margin-left: 0px; width: 730px;"><div
 style="width: 1004px; height: 100px;" id="entete"><span
 style="text-decoration: underline;"><img
 style="width: 1000px; height: 105px;" alt=""
 src="../image/icones/entete.jpg"></span><br></div><div
 style="width: 235px; left: -2px; bottom: auto; top: 106px; height: 458px;"
 id="menu"><div><div><a
 href="file:///C:/CCM/ccm/Presentation/competences.html"><img
 style="border: 0px solid ; left: 8px; top: 154px; width: 233px; height: 33px;"
 alt="comp&eacute;tences" src="../image/icones/actif/commissions.jpg"></a></div></div><div></div><br><br><br><a
 href="Presentation.html"><img
 style="border: 0px solid ; left: 1px; width: 236px; top: 400px; height: 21px;"
 alt="RETOUR" src="../image/GIF/perso.gif"></a><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><div
 style="text-align: center;"><img
 src="../kompozer_80x15.png" alt="kompozer_80x15.png"><br></div></div><div
 style="width: 723px;" id="texte"><br><div
 style="text-align: center;"><br></div><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></div><div
 style="text-align: center; margin-top: 360px; width: 1000px; height: 29px; top: 208px; left: -2px;"
 id="pied">&nbsp;<a href="../index.html">Accueil</a>
| <a href="../Environnement/Environnement.html">Environnement</a>
| <a href="../Economie/Economie.html">Economie</a>
| <a href="../Logement/logementcadredevie.html">Logement
et cadre de
vie</a> | <a href="../Vie%20locale/Vielocale.html">Vie
locale</a>
| <a href="../marches/Marches.html">March&eacute;s</a>
|
<a href="../liens/Liens.html">Liens</a>
| <a href="mailto:../Contact.html">Contact</a></div></body></html>
Alors ça va faire brouillon mais ça c'est mon code de page avant d'avoir inséré mon image pour laquelle je veux ouvrir une petite fenête sans enlevé ce qui est inscrit autour!

Je vais faire ma présentation sans ce lien et je vous remets le code!

:( je trouve que ça fait pas clean mon truc!!!

Je ne sais pas si je peux coder dans notepad et reprendre dans Komposer?
Avec le xhtml et le css dans note pad je m'en sors car c'est structuré!
:shock:


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.6) Gecko/2009011913 Firefox/3.0.6
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Message par chinon37 »

Tu peux installer l'extension Nsmcontext pour Kpz, tidy, et Notepad++.
Avec tout ça, tu as un outil super.
Tu pourras faire la navette facilement entre Notepad++ (ou un autre éditeur de texte comme Komodo edit) et KpZ.
Les modalités d'installation sont là: http://josar.free.fr/tutoKompozer/kompozerInstal.html

Message envoyé avec : Mozilla/5.0 (X11; U; Linux x86_64; fr; rv:1.9.0.6) Gecko/2009020911 Ubuntu/8.04 (hardy) Firefox/3.0.6
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 17 invités