[MMO WEB] Mechas War - Un jeu de ROBOTS avec des boulons dedans!

[@lucard]

Code :

<div id="fonctions">
        <span id="span_vue" onclick="document.getElementById('iframe_vue_mechas').src='vuemechas.php';$('#fenetre_vue_mechas').dialog('open');" title="Vue du Mechas">Vue <img id="loupe" name="loupe" src="images/interface/icones/icone_loupe.png" border="0">
        </span><span id="span_millieu">|</span>
        <span id="span_configuration" onclick="document.getElementById('iframe_mech_lab').src='mech_lab_v2.php';$('#fenetre_mech_lab').dialog('open');javascript:introJs().exit();">
        <a id="btn_mechlab" href="#" class="btn_menu" onclick="document.getElementById('iframe_mech_lab').src='mech_lab_v2.php';$('#fenetre_mech_lab').dialog('open');javascript:introJs().exit();">
           </a>Configuration</span>
        </div>

Y'a une sacrée révision des codes à faire.

je dirais qu'il serait préférable, pour une plus grand compatibilité entre les différents navigateurs de mettre des liens/boutons sur des balise <a> plutôt que des span
J'ai aussi l'impression que tu fais un nouveau "bout de code" css pour chaque div que tu crées.
Le problème, c'est que si tu veux un "style" global, il va falloir que tu épluches chaque cascade de style que tu as fait.
en faisant un css avec 2 type de div (une bleu et une orange) ça te sera plus facile pour modifier ton design. (et plus rapide aussi =) )


Pour ajouter de la "lisibilité" place un pointer sur chaque "zone" cliquable ! c'est vraiment ce qu'il me choque le plus.

#fonctions>span {

cursor:pointer;

}

/*changement de couleur au survole */

#fonctions>span:hover{

text-decoration:underline;

color:white;

}

[Xenos]

Oui, la span se remplace simplement par un <a href="vuemechas.php" target="iframe_vue_mechas">...</a> (je ne sais plus si target contient l'id ou le name de l'iframe: à tester). Au besoin, ajoute un event (plutôt qu'un attribut onclick) via addEventListener par exemple, de sorte qu'au clic, l'iframe (ou son parent) se voit attribuer une classe CSS qui l'affichera, la tournera, ou en fera des confettis (peu importe).

Une bonne structure, il me semble, consiste à placer dans le HTML le sens des éléments (à quoi sert chaque élément? A naviguer? A agir? C'est une liste? C'est un titre?...), dans le CSS, les apparences (display, color,...) et dans un JS, les éventuelles interactions supplémentaires (qui généralement sont assez réduites avec un bon balisage & un bon CSS).

Je te déconseille d'utiliser les ID pour indiquer le genre d'un élément (span_milieu, il me semble que c'est un genre, pas un identifiant unique). De même, évite d'utiliser le nom du tag dans l'id ou la classe (si le tag vient à changer, l'id/classe ne fera plus sens). Sinon, je suis contente de ne pas y voir des class="green", comme j'en vois au taff

[starmindfr]

Merci je vais tester tout ca

[starmindfr]

Pour l'iframe depuis le a - href je vais approfondir, pour l'instant ca me recharge la page entiere de l'url du href en plein ecran depuis l'iframe et non juste l'iframe ... a voir

[Xenos]

Je n'ai rien compris à l'énoncé du problème !

S'il s'agit d'un lien dans l'iframe qui recharge la page complète, il faut voir là encore avec l'attribut @target, probablement la valeur _self.

[starmindfr]

Bonjour en fait j'ai trouvé le "name" de l'iframe etant légèrement different de l'ID donc il ouvrait un nouvel onglet a la place

Apres le défaut c'est que je me retrouve avec tout le style d'une <a> donc la police, le surlignage etc... ayant deja du css sur les a ref contrairement au span il me semble.

[Xenos]

Si tu veux changer le style des ancres qui ouvrent des iframe, tu peux utiliser des sélecteurs CSS3 un peu plus avancés, ou simplement des classes

a[target="monIFrame"] {

/* ... */

}

a.opensIFrame {

}

[Ter Rowan]

dans tous las cas, il est aisé en css de faire sauter le surlignage, la couleur, etc...

par défaut span est vide et a est quelque chose mais tu peux décider de rendre a "vide"

[starmindfr]

oui je pense que je vais continuer sur les classes a.x {} comme j'en ai deja pas mal.

[@lucard]

un truc qui pourrait-être sympa :

Changer la "gueule" du Mécha en fonction des options choisis
p'tit test : http://codepen.io/CyrilLevallois/full/NPerYx/