[Plan du site] Vous êtes ici --- > Le Site du Zéro > Les forums > Site Web > XHTML / CSS / Javascript > FOIRE AUX QUESTIONS (X)HTML - CSS - JAVASCRIPT > Lecture du sujet

FOIRE AUX QUESTIONS (X)HTML - CSS - JAVASCRIPT

A CONSULTER IMPERATIVEMENT AVANT DE POSTER

Vous devez être inscrit pour pouvoir poster des messages

Page : 1 2 Suivante

Auteur

Message

1 visiteur sur ce sujet (1 anonyme)

Page : 1 2 Suivante

strucky

# Posté le 02/08/2007 à 19:57:52

Je suis tombé par terre ...

Groupe : Membres

Les questions (X)HTML et CSS

Les questions Javascript

Les questions Javascript/Ajax

Autres points & ressources

Pour compléter cette FAQ vous pouvez apporter votre contribution dans ce sujet

strucky

# Posté le 02/08/2007 à 20:08:02

Je suis tombé par terre ...

Groupe : Membres

Auteur : Duarna

Pourquoi mon bloc ne se centre pas même avec un margin défini à auto ?

Réponse : Pour fonctionner, un margin: auto; a besoin d'une largeur fixe (exprimée en pixels, pourcentages, etc ...).
Par exemple :Code : CSS

BaliseDuBloc
{
margin:auto;
/* Les marges sont automatiques */
width:100px;
/* On donne une taille fixe au bloc pour que cela fonctionne */
}

strucky

# Posté le 02/08/2007 à 20:15:42

Je suis tombé par terre ...

Groupe : Membres

Auteur : Thunderseb

Comment empêcher Internet Explorer de mettre une petite barre d'outils sur les images lors du survol de celles-ci par la souris ?

Mettez tout simplement cette petite balise meta dans le head de votre page :

Code : HTML

strucky

# Posté le 02/08/2007 à 20:20:34

Je suis tombé par terre ...

Groupe : Membres

Auteur : Thunderseb

Comment définir les marges intérieures des cellules ainsi que les espaces entre les cellules dans un tableau ?

Pas besoin de CSS pour cela. On va utiliser les attributs CELLSPACING (espace entre les cellules) et CELLPADDING (marge intérieure) de la balise TABLE.
Ces attributs sont valides XHTML 1.1 :

Code : HTML

<table cellspacing="2" cellpadding="4">
<tr>
<td>Cellule du dessus</td>
</tr>
<tr>
<td>Cellule du dessous</td>
</tr>
</table>

strucky

# Posté le 02/08/2007 à 20:26:02

Je suis tombé par terre ...

Groupe : Membres

Auteur : IntoX94

Pourquoi mon site n'est pas centré sous IE ?

On vous a appris à utiliser:
Code : CSS

body {
margin: auto;
width: 800px /*largeur de votre site*/
}

Pour centrer votre site.
Mais cette technique ne fonctionne pas sous Internet explorer.
Pour centrer le site sous IE, il faut utiliser cela:
Code : CSS

body {
width: 800px;
text-align: center; /*on centre le site, mais le texte est lui aussi centré*/
margin: auto; /*on centre pour Firefox et les autres navigateur excepté IE*/
}

#all { /* id du bloc qui englobe tout votre site*/
width: 800px; /*largeur du site*/
text-align: left; /*on align le texte à gauche*/
}

strucky

# Posté le 02/08/2007 à 20:31:12

Je suis tombé par terre ...

Groupe : Membres

Auteur : Oylex

Question : Comment faire fonctionner les labels sur IE

Réponse :

Il faut mettre un id sur l'input et mettre un for sur le label :
Code : HTML

<form method="post" action="traitement.php">
<p>
<label for="nom">Votre pseudo : <input type="text" name="pseudo" id="nom" /></label>
</p>
</form>

Ce code fait aussi la même chose:
Code : HTML

<form method="post" action="traitement.php">
<p>
<label for="nom">Votre pseudo : </label>
<input type="text" name="pseudo" id="nom" />
</p>
</form>

strucky

# Posté le 02/08/2007 à 20:35:27

Je suis tombé par terre ...

Groupe : Membres

Auteur : Lpu8er

Comment créer 3 "colonnes" sans tableaux ?

Il suffit d'utiliser float une seconde fois.
N'oubliez pas de préciser une taille.

Par exemple, pour trois colonnes de même largeur:
Code : HTML

<div style="float: left; width: 30%;">
Tout à gauche
</div>
<div style="float: left; width: 30%;">
Au milieu
</div>
<div style="float: right; width: 30%;">
Tout à droite
</div>

N'oubliez pas non plus le clear: both; au besoin.

strucky

# Posté le 02/08/2007 à 20:39:22

Je suis tombé par terre ...

Groupe : Membres

Auteur : le_stoppeur

Question : Comment centrer un bloc verticalement ?

Réponse :
Code : HTML

<html>
<head>
<style type="text/css">

</style>

</head>
<body>

<div class="centre">
ce calque est centré dans la page
</div>

</body>
</html>

(via)

strucky

# Posté le 02/08/2007 à 20:43:03

Je suis tombé par terre ...

Groupe : Membres

Auteur : gcyrillus

Comment englober un flottant ?

Reponses : 4 Methodes.

1ere methode classique et tres repandue css + html :

ajouté dans le conteneur et en dernier un <hr> avec en regle css : clear:both (ou right ou left, selon configuration de la page ). Cette methode peut ne pas etre appliquable , car le clear both va aussi prendre en compte les elements flottants exterieurs.

, zut alors.

2eme methode css
Elle consiste en quelque sorte a activé le "layout" dans firefoxe (par exemple).

appliqué un overflow:hidden ou auto au conteneur , .... oui mais si je donne une dimension en hauteur a mon div , que se passe t-il quand ça depasse ? ... la regle overflow: est appliqué. (Il faudra choisir entre extensible ou fixe ):)

3eme methode css
Cette methode va consisté a reprendre la premiere methode sans ajouté de balise dans le html mais de provoqué cet etat par le biais du css a l'aide du pseudo element :after , avec les mêmes effets et defauts.
Code : CSS

.conteneur:after {
content: "";
display: block;
clear: both;
}

une simple "class" suffit a reutilisé le principe a plusieurs reprise dans la page.
Bien entendu , IE ne reconnait pas cette régle , mais il englobe généralement de lui même les flottants.

4eme methode css

Cette methode va consister , comme l'overflow a activer le "layout" et ainsi forcer l'affichage en englobant le flottant dans la zone du conteneur.

Cette regle css est : display:table; pour firefoxe , et/ou au choix pour opera display:inline-block cette seconde valeur peut-etre accessoirement utilisée pour IE.
en adjoignant a cette methode un width:100%; l'element retrouve son comportement de balise de type "block" en s'etalant sur la largeur disponible de son parent .

d'accord , mais dans firefoxe , l'element va se comporter comme un tableau , et s'elargir si le contenu (image ou tres long mots), est inséré ? ... jamais content !

5eme methode
(je n'en ai pas en tête , mais peut-etre y en a t-il dautres. )

Nous voila donc tres content , ces satanées flottant qui depassent ont maintenant au moins 4 methodes qui permet de les garder en boites !

Chacunes de ces methodes auront leur inconvenients , a vous de choisir celle qui vous convient le mieux.

voici le code test de la 4eme methode ( comportement que j'ai remarqué en cherchant a faire de l'alignement-vertical d'element de type "block" ):
Code : HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>display:table; / display:inline-block;</title>
<style type='text/css'>
ul {
float:left;
margin:0 1em;
padding:0 1em;
border:1px solid #eee;
/* enlevons le bug de "double marge" d'IE */
display:inline;
}
div {
background:gray;
/* activons les "layout" respectif des navigateurs */
display:table; /* pour ff */
display:inline-block;/* pour IE , opera et les autres vraisemblablement */
width:100%; /* pour reprendre le comportement de base d'un "block" */
}</style>
</head>
<body>
<div>
<ul>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<h1>Alternative a , overflow, clear both ou :after</h1>
<p>un petit paragraphe pour faire : bonjour le monde ! ça va ?</p>
</div>
</body>
</html>

Et le lien pour les faineants du analyser/copier/coller/comprendre

http://gcyrillus.free.fr/trucs_css/bug-flottant-nouvelle-methode.html

strucky

# Posté le 02/08/2007 à 20:47:49

Je suis tombé par terre ...

Groupe : Membres

Auteur : Tails the fox

Comment oter la bordure autour d'une image située dans un lien ?

Réponse :

Code : HTML

Code : CSS

a img
{
border: none;
}

strucky

# Posté le 03/08/2007 à 09:38:18

Je suis tombé par terre ...

Groupe : Membres

Auteur : gcyrillus

Comment empecher un "block" de passer sous un flottant ?

Reponses:

d'abord un petit blabla a propos de ces "satanés " flottants.

Les elements placées en "float" , ont des comportements difficiles a apprehender pour les débutants.
On ne sait pas trop ou il se trouvent , ni comment ils interagissents avec le reste des élements.

Tout d'abord ils vont se placer à droite ou à gauche (selon float:left; ou right; )a partir de l'endroit ou ils se trouvent dans le html .
Première réaction étonnante , ils font un saut de ligne s'il y a quelque chose devant eux !

comme un élément de type "block".

Deuxième réaction, ils se reduisent à la taille de leur contenu .

comme s'ils etaient positionné en absolu !

Troisième effet désagréable , ils n'étirent pas leur conteneur ou deborde sur les autres en repoussant leurs contenus.

ça ressemble presqu'a du position:absolute; ça .

En fait c'est presque ça , le flottant est effectivement retiré du flux , mais pas son contenu auquel il reserve de la place . et pourtant il semble etre invisible aux elements block qu'il le cotoient (excepté pour les contenus qui n'iront ni glisser dessous n'y s'y superposé, arf !)
Il peut-etre dimensionné quelque soit la balise a la base inline ou block. (une reserve toutefois sur certains elements de formulaires et selon les navigateurs qui en generale acceptent difficilement d'etre re-stylés).

Et pourtant

, on peut "ouvrir" les yeux aux autres element de la page qui pourront alors les prendre en compte dans leur positionement.

Dans IE

, on aura besoin d'activer le layout (haslayout).

celui-ci s'active de plusieurs manieres .

display:inline-block;
width:xx;
height:xx;
float:left; ou right; (tiens !)
position:absolute; (bon la on a tout faux pour le resultat recherché )
zoom:1; (non valide , mais utile a connaitre pour tester rapidement si un probleme vient de la )

pour l'exemple je releve que le display:inline-block; est la regle qui me convient au mieux , width et height ne me sont d'aucune utilité , et les autres ne conviennent pas mieux.

Pour les autres :

il y a aussi quelques regles que l'ont peut utiliseés , il ne s'agit pas la du même concept de "haslayout" typique d'IE mais simplement de prendre en compte les flottants.

display:table;
display:table-cell;
display:table-row;
display:inline-block;
float:left; ou right; (tiens encore!)
overflow:hidden;
overflow:auto;

On remarque a nouveau le "display:inline-block; "

Attention , Firefoxe ne reconnait pas cette valeur , quand aux autres ils applique cette valeurs comme le preconise le w3c. LE resultat ne sera pas celui que IE va donner si les blocks auxquels on applique cette valeur on peut de contenus.
Les valeurs display:table et les 2 autres (ainsi que inline-block) vont bien effectivement se demarquer du flottant mais auront un comportement assez similaire , il ne prendront que la taille de ce qu'il contiennent .Inline-block , ne provoqueras pas de retour a la ligne apres lui !

reste le overflow:auto; ou hidden .

Si vous usez du overflow:auto; et que votre boite (block) reçoit aussi une valeur de hauteur (ou largeur) , le scroll apparaitras bien sur , mais le "haslayout" dans IE sera automatiquement activé par la taille donnée.
Si vous souhaité donné une dimension mais gardé l'effet d'etirement alors , choissisez un display:table ; + width:xx; et height:xx; .

Pour l'exemple on garde donc le overflow

le code de la page exemple et un lien pour tester (apres le code vous allez le regarder quand - même ! ).Code : HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>overflow:hidden; / display:inline-block;</title>
<style type='text/css'>
html {
background:#345;
}
body {
background:#678;
padding:0.5em;
}

ul {
float:left;
margin:0.5em 1em;
padding:0 1em;
border:1px solid #eee;
/* enlevons le bug de "double marge" d'IE */
display:inline;
background:#abc;
}

div {
background:#789;
padding: 10px ;
margin-bottom:1px;
}
#contourne h1 , #contourne p , #aligne {

/* activons le layout */
overflow:hidden;
}

h1 , p {
background:#abcdef;
margin:0px 0px 1px;

}
</style>

</head>
<body>
<ul >
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<div id ="contourne">
<h1>Empecher des 'block' de passer sous un flottant</h1>
<p>un petit paragraphe pour faire : bonjour le monde ! ça va ?</p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
<p> et d'autre pour montré qu'ils peuvent glisser dessous </p>
</div>
<ul >
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<div id="aligne" >
<h1>Empecher un 'block' de passer sous un flottant et aligner ses contenus au dela .</h1>
<p>un petit paragraphe pour faire : bonjour le monde ! ça va ?</p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
<p> et d'autre pour montré qu'ils peuvent rester aligner dans le conteneur </p>
</div>
</body>
</html>

ah oui la page test en ligne :
http://gcyrillus.free.fr/trucs_css/flottant-et-element-exterieur-methode.html

Pour en savoir plus sur ces proprietes , n'hesitez pas a faire des recherches sur le site du w3c et surtout google , plusieurs sites proposes des dicos , triées de preferences les pages les plus recentes et recoupées les infos recoltées , faites vous mêmes vos petits tests pour apprivoisse ces valeurs "css" .

strucky

# Posté le 03/08/2007 à 09:45:48

Je suis tombé par terre ...

Groupe : Membres

Auteur : rk2

Comment faire pour que le background ne se répète pas ?

Réponse : Utiliser le code css suivant :

Code : CSS

Variante:
Code : CSS

background-repeat: repeat-x;

répète le background seulement sur l'axe X (horizontal)

Variante 2:
Code : CSS

background-repeat: repeat-y;

répète le background seulement sur l'axe Y (vertical)

strucky

# Posté le 03/08/2007 à 09:50:42

Je suis tombé par terre ...

Groupe : Membres

Auteur : Sylvain.sab

Le validateur CSS du W3C me donne une erreur : «Redéfinition de la propriété .... » Pourquoi ?

Réponse :

Ca veut dire que vous utilisez plusieurs fois la même proriété sur un élément.
Par exemple : Code : CSS

a
{
color:green;/*les liens seront en vert*/
/*............*/
/*du code*/
/*............*/
color:purple;/*ca ne va pas car on utilise deux fois la même propriété*/
}

C'est souvent le cas lorqu'on utilise des !important pour avoir un style différent dans IE et les autres navigateurs.

A noter que ce ne sont que de simples avertissements et ne rendent pas un css invalide.

strucky

# Posté le 03/08/2007 à 09:53:56

Je suis tombé par terre ...

Groupe : Membres

Auteur : metalking

Question : Comment appliquer plusieurs classes CSS à un seul et même objet

Réponse : Séparez simplement les différentes classes par un espace dans l'attribut class=""

Code : CSS

.centre {
text-align: center;
}
.gras {
font-weight: bold;
}
.rouge {
color: red;
}
.bordure {
border: 1px solid black;
}

Code : HTML

<p class="centre gras rouge bordure">
texte auquel on a appliqué les classes CSS 'centre', 'gras', 'rouge' et 'bordure'.
</p>

strucky

# Posté le 03/08/2007 à 10:01:08

Je suis tombé par terre ...

Groupe : Membres

Auteur : Kels

Comment faire pour que mon lien s'ouvre dans une autre fenêtre ? pour faire un pop-up quoi..

Le (X)HTML ne permet pas de le faire, il faut utiliser du javascript.
Code : JavaScript

Ce script permet d'ouvrir la page "page.html" dans une nouvelle fenêtre.

Pour plus d'informations et des options comme par exemple la taille de la fenêtre qui va s'ouvrir, consultez ce site.

Attention tout de même à ne pas abuser des pop-up, les net-addicts que vous êtes le savent: trop de pop-up tue la navigation.

Sachez également que certains navigateurs récent, je pense à firefox, ont le pouvoir de forcer les pop-up à s'ouvrir dans un nouvel onglet et non une nouvelle fenêtre.

strucky

# Posté le 03/08/2007 à 14:19:04

Je suis tombé par terre ...

Groupe : Membres

Auteur : Tails the fox

Optimiser son référencement sur les moteurs de recherche

1 -/ Le contenu

Cela peut paraître tout simple mais il est primordial d'avoir un contenu utile et original, il faut intéresser le visiteur. Il est également indéniable qu'un gros site (plus de 100 pages) aura bien plus de chances d'être bien classé qu'un petit site de 10 pages. D'une part car ayant plus de contenu, vous avez plus de mots-clés susceptibles de correspondre avec une recherche sur Google. D'autre part vous augmenterez globalement le PageRank de votre site.

2 -/ De nombreux liens externes

Il est absolument indispensable d'avoir un grand nombre de liens pointant vers votre site. Proposez aux webmasters de sites similaires d'échanger des liens. N'oubliez pas qu'il est parfois intéressant d'avoir un lien vers une page différente de la page d'accueil : le lien sera sans doute plus adapté au contenu de la page faisant le lien, donc plus intéressant pour le visiteur, et vous améliorerez directement le PageRank de votre page spécifique.

3 -/ Des liens externes de qualité

Choisissez bien (dans la mesure du possible) les sites à qui vous demandez de faire un lien vers le vôtre. Privilégiez bien sûr les sites ayant un bon PageRank (ou plus précisément ceux dont la page de liens a un bon PageRank et peu de liens). Préférez également les sites traitant du même sujet : en général il est plus fréquent que l'échange de liens se fasse, cela profite au visiteur, et vous resterez dans les mêmes mots-clés (ce qui pourrait être pris en compte par Google).

4 -/ Bien choisir le titre de chaque page

C'est un critère très important. Le titre doit refléter le contenu réel de la page. Il ne doit pas être constitué d'une série de mots-clés, bien que le choix des mots soit primordial. Placez de préférence les mots les plus stratégiques en début de titre. La taille maximale conseillée est d'environ 60 caractères.

5 -/ S'inscrire dans les grands annuaires

Certains semblent avoir une importance plus grande pour Google, il faut donc absolument y être inscrit : il s'agit de DMOZ et Yahoo!. Les autres annuaires (MSN, Voila, Nomade, etc.) apportent également non seulement du trafic mais aussi améliorent votre PageRank, au prix d'une soumission rarement gratuite...

6 -/ Pas de frames, et un nom de domaine

N'utilisez pas de frames, donc pas non plus d'adresse de redirection (style Ulimit) : achetez-vous un nom de domaine et un hébergement payant. En plus avec un nom de domaine vous ne risquez pas de changer d'adresse (ex : hébergeurs gratuits qui se font racheter et changent d'adresse), ce qui est catastrophique pour le référencement.

7 -/ Un site toujours disponible

Googlebot, Le robot d'indexation de Google réagit comme tout autre visiteur : s'il vient voir votre site et que celui-ci n'est pas accessible (ex : pages introuvables, erreur 404), alors il risque de rayer votre site de la liste jusqu'à la prochaine mise à jour (mensuelle). Encore une fois, un site hébergé chez un professionnel aura plus de chances d'être toujours accessible que chez un gratuit.

8 -/ Interconnexion de vos pages

Bien penser à lier vos pages entre elles, en utilisant des mots ciblés au lieu de liens du style "cliquez ici". En général plus une page est importante, plus elle doit recevoir de liens des autres pages (structure hiérarchique arborescente). Il est conseillé de concentrer sur une ou quelques pages les liens externes.
Il est souvent utile de faire un plan du site, qui permet à vos visiteurs mais aussi aux robots d'indexation de parcourir l'ensemble des pages de votre site. Tenez donc ce plan à jour, et faites un lien vers cette page depuis quelques unes ou toutes les autres pages de votre site (un petit lien en bas de page par exemple).

9 -/ Pas de site sans texte

ex: tout en flash, ou tout en images. Sinon le site ne comporte presque aucun mot-clé et en conséquence ne pourra pas sortir dans les résultats de Google. Pour les images il est conseillé d'utiliser l'attribut ALT qui permet de donner une description textuelle. Si l'image est incluse dans un lien, alors le texte situé dans le ALT peut jouer un rôle similaire au texte des liens classiques, ce qui est très important.

Si vous avez un catalogue de pages avec peu de texte, ou par exemple une galerie d'images, débrouillez-vous pour attribuer des titres différents à chaque page.

10 -/ Mises à jour régulières du site

Google adore les sites mettant souvent à jour leur contenu. C'est logique, les internautes aussi préfèrent les sites qui proposent régulièrement du nouveau ! Ajoutez donc aussi souvent que possible du contenu, si possible sur des pages liées par d'autres sites.
De plus, un site régulièrement mis à jour aura des chances de voir GoogleBot venir indexer les pages fréquemment. Pour analyser ses visites, installez RobotStats, c'est facile et gratuit !

Ajoutez par exemple une rubrique Actualité, ou même un WebLog, c'est à la mode !

Sources : http://www.webrankinfo.com

strucky

# Posté le 04/08/2007 à 02:00:08

Je suis tombé par terre ...

Groupe : Membres

Comment centrer un émoticone sur une ligne de texte ?

Réponse :

Il suffit d'utiliser la propriété css vertical-align

Code : HTML

<p>début du texte <img class="emoticone" src="url_de_l_image" alt=" :) " /> suite du texte</p>

Code : CSS

img.emoticone {
vertical-align: middle;
}

strucky

# Posté le 04/08/2007 à 16:09:30

Je suis tombé par terre ...

Groupe : Membres

Comment faire fonctionner une propriété css contenant un trait d'union sur un élément en javascript ?

Réponse :

En supprimant le tiret, et en mettant la 1ère lettre du mot suivant en majuscule.

Exemples :

Code : JavaScript

// Un margin-left
document.getElementById('id').style.marginLeft = '2em';

// Un border-right-color
document.getElementById('id').style.borderRightColor = '#00f';

strucky

# Posté le 04/08/2007 à 22:25:26

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Pourquoi mes pages affichées grâce à XMLHttpRequest contiennent des "?" en lieu de place des caractères accentués ?

Réponse :
Tous vos fichiers sont sûrement encodés en ISO-8859-15. Or, le fichier téléchargé par XMLHttpRequest est considéré par défaut comme étant encodé en utf-8.

Il faut donc modifier le fichier téléchargé pour indiquer explicitement son encodage, grâce à un header php en début de code:
Code : PHP

header('Content-type: text/html; charset=ISO-8859-15');

strucky

# Posté le 04/08/2007 à 22:27:42

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Pourquoi mon script d'actualisation (ajax) ne marche pas sur Internet Explorer alors que je n'ai aucune erreur ?

Réponse :
Si vous utilisez la méthode "GET", Internet Explorer va mettre le fichier téléchargé en cache et n'en téléchargera pas un nouveau à chaque actualisation.

Il faut rajouter des header en début de code php dans la page qui est téléchargée pour interdire la mise en cache:Code : PHP

//Exemple 1676. Interdire la mise en cache avec header()
//http://fr.php.net/manual/fr/function.header.php
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date du passé

strucky

# Posté le 04/08/2007 à 22:30:06

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Pourquoi mes "+" se transforment en espaces ?

Réponse :
Si vous ne le faites pas déjà, il faut utiliser la fonction escape pour protéger les variables (issues des formulaires par exemple).
Par exemple, si on fait:
Code : JavaScript

xhr.send('variable1=' + document.formulaire.champs.input);

En tapant "blabla&variable2=foo" dans le formulaire,
On va obtenir la chaîne: Citation

variable1=blabla&variable2=foo

soit deux variables au lieu d'une !

C'est pour cela qu'il faut utiliser escape pour remplacer les caractères spéciaux (comme le "&"):
Code : JavaScript

xhr.send('variable1=' + escape(document.formulaire.champs.input));

Seulement, cette fonction est boguée et ne remplace pas le caractère spécial "+", il faut donc la corriger:
Code : JavaScript

(function () {
var escape_old = escape; //ancienne fonction escape
escape = function (texte)
{
return escape_old(texte).replace(/\+/g,'%2B');
};
})();

(ce morceau de code est à placer en début des sources pour "corriger" escape).

strucky

# Posté le 04/08/2007 à 22:32:05

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Comment appeler une fonction située dans la page mère à partir d'une popup ?

Réponse : Il faut utiliser la propriété window.opener qui donne accès à la page mère.
Par exemple:
Code : JavaScript

window.opener.ajouter_smiley(':)');

strucky

# Posté le 04/08/2007 à 22:33:27

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Pourquoi les attributs onclick sur les balises <option> ne marchent pas sur Internet Explorer ?

Réponse :
L'attribut onclick sur une balise option est invalide et Internet Explorer a donc raison de refuser de fonctionner.
Il est plus logique (et souvent plus pratique) d'utiliser l'évènement onchange sur la balise select.

Exemple dans le cas d'un bbcode:
Code : HTML

<select id="couleur">
<option onclick="bbcode('[couleur=rouge]','[/couleur]');">Rouge</option>
<option onclick="bbcode('[couleur=vert]','[/couleur]');">Vert</option>
<option onclick="bbcode('[couleur=blue]','[/couleur]');">Bleu</option>

</select>

Devient (en utilisant value):
Code : HTML

<select id="couleur" onchange="bbcode('[couleur=' + this.value + ']','[/couleur]');">
<option value="rouge">Rouge</option>
<option value="vert">Vert</option>
<option value="bleu">Bleu</option>

</select>

strucky

# Posté le 04/08/2007 à 22:35:17

Je suis tombé par terre ...

Groupe : Membres

Auteur : Boo2M0rs0

Pourquoi lorsque je tape plusieurs fois la même balise, la prévisualisation de mon bbcode se trompe ?

Réponse :
C'est dû à la gourmandise des quantificateurs: l'expression régulière cherche à englober le plus de caractères possibles:
Code : JavaScript - Afficher / masquer les numéros de ligne

'a zzz b a zzzz b'.replace(/a(.+)b/g,'[]$1[/]');
//donne: "[] zzz b a zzzz [/]"

En plaçant un "?" après le quantificateur, la gourmandise est inversée:
Code : JavaScript - Afficher / masquer les numéros de ligne

'a zzz b a zzzz b'.replace(/a(.+?)b/g,'[]$1[/]');
//donne: "[] zzz [/] [] zzzz [/]"

strucky

# Posté le 06/08/2007 à 15:56:23

Je suis tombé par terre ...

Groupe : Membres

Pourquoi avec IE la hauteur d'un bloc ne veut pas descendre en dessous d'une certaine taille ?

Réponse :

Ceci est dû à ce qu'IE refuse de descendre la hauteur de ce bloc en dessous de la taille du font-size, il fait comme-ci le bloc en question contenait des caractères.

Pour règler ce problème, il suffit simplement de définir le font-size à 0.

Code : CSS

#monBloc {
height: 7px;
font-size: 0;
}

strucky

# Posté le 16/08/2007 à 13:00:54

Je suis tombé par terre ...

Groupe : Membres

Auteur : Thunderseb

Comment écrire du code HTML qui ne soit pas interprété ?

Il suffit simplement de remplacer des chevrons d'ouverture et de fermeture des balises par leurs entités respectives :

Entités

Caractères	Entités
<	<
>	>

Ainsi, si vous souhaitez écrire ceci :

Citation

Il vous faudra écrire cela :

Citation

N'oubliez pas, si votre code est inclut dans une phrase, de le placer dans la balise CODE. Si votre code s'étale sur plusieurs lignes, vous pouvez utiliser la balise block PRE.

Faites attention qu'un élément PRE ne peut contenir d'autres éléments (comme des SPAN). Si vous voulez colorer des parties de votre code, vous devrez utiliser une simple balise DIV

strucky

# Posté le 21/08/2007 à 20:24:41

Je suis tombé par terre ...

Groupe : Membres

Comment avoir le curseur positionné dans un champ de mon formulaire au chargement de la page ?

Réponse :

Il suffit d'utiliser la méthode focus() de javascript.

Exemple :

Code : HTML - Afficher / masquer les numéros de ligne

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>focus sur le champ de recherche au chargement</title>
<meta name="generator" content="Bluefish 1.0.7"/>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<style type="text/css">
input#recherche:focus{ background: #ffc; }
</style>
</head>
<body onload="document.forms['form'].recherche.focus()">
<form id="form" action="" method="post">
<label for="recherche">Rechercher </label>
<input type="text" id="recherche" name="recherche" />
</form>
</body>
</html>

Dans :
Code : JavaScript - Afficher / masquer les numéros de ligne

document.forms['form'].recherche.focus()

form est l'id du formulaire.
recherche est le name du champ devant recevoir le focus.

strucky

# Posté le 08/09/2007 à 13:19:54

Je suis tombé par terre ...

Groupe : Membres

Auteur : 5.56 mm

Liste des outils de validation (non exhaustive)

en anglais
validator.w3c.org
en français
validome.org
w3qc.org/validateur
en français et multi page
proze.net/outils/validation-site.html

strucky

# Posté le 08/09/2007 à 13:34:09

Je suis tombé par terre ...

Groupe : Membres

Auteur : KorangaR

Pourquoi mes accents s'affichent bizarrement ?

Reponse :

La solution est de faire en sorte que la déclaration du charset qui se trouve généralement entre une balise meta soit en cohérence avec l'encodage réel de votre page. Pour changer l'encodage réel de votre page sous Notepad, il faut aller dans l'onglet "Format" et choisir entre ANSI et UTF-8 sans BOM tout en sachant qu'ANSI correspond à iso-8859-1(5). Avant de sauvegarder votre fichier, il est nécessaire de retaper tous vos caractères spéciaux.

A noter que c'est une des raisons pour laquelle les caractères spéciaux peuvent-être altérés, il se peut en effet que le problème vienne d'ailleurs (charset de la base de données, fihier xml, script ajax, etc...).

strucky

# Posté le 15/09/2007 à 15:12:29

Je suis tombé par terre ...

Groupe : Membres

Outils d'aide au développement à intégrer aux navigateurs

Firefox/Iceweasel et autres navigateurs basés sur gecko

Internet Explorer

Opera

Ceci est une liste exhaustive, si vous connaissez d'autres extensions utiles au développement de page web, n'hésitez pas à les signaler.

Retour au forum "XHTML / CSS / Javascript" ou à la liste des forums

Vous devez être inscrit pour pouvoir poster des messages

Tutoriels

Communauté

Mon compte

Recherche

Livre d'or

Publicité

FOIRE AUX QUESTIONS (X)HTML - CSS - JAVASCRIPT

A CONSULTER IMPERATIVEMENT AVANT DE POSTER

Les questions (X)HTML et CSS

Les questions Javascript

Les questions Javascript/Ajax

Autres points & ressources

d'abord un petit blabla a propos de ces "satanés " flottants.

Et pourtant

Dans IE

Pour les autres :

Réponse :

1 -/ Le contenu

2 -/ De nombreux liens externes

3 -/ Des liens externes de qualité

4 -/ Bien choisir le titre de chaque page

5 -/ S'inscrire dans les grands annuaires

6 -/ Pas de frames, et un nom de domaine

7 -/ Un site toujours disponible

8 -/ Interconnexion de vos pages

9 -/ Pas de site sans texte

10 -/ Mises à jour régulières du site

Entités

Firefox/Iceweasel et autres navigateurs basés sur gecko

Internet Explorer

Opera