chrispc T'es tendue Natasha ! | Bonjour,
J'ai créé un système de notation perso pour mon site. Tout fonctionne sauf que le focus s'enlève de ma notation et on ne sait plus la note qu'on a attribué à part si on va voir dans l'url car j'ai mit une ancre qui change en fonction du clic sur les liens.
Donc lorsque je clique sur mon lien qui correspond à ma note 1 => href="#1" => JS ( ....valut = '1' ). Tout est bon sauf que lorsque je clique ailleurs je ne vois plus la note attribué. Le focus reprend sa couleur de départ, le gris ( Gris => clique => orange => clique ailleurs => revient à gris ).
Code :
Code :
- HTML5:
- echo'<div class="rating">';
- echo'<a href="#5" onclick="Objet.note5();">H</a>';
- echo'<a href="#4" onclick="Objet.note4();">H</a>';
- echo'<a href="#3" onclick="Objet.note3();">H</a>';
- echo'<a href="#2" onclick="Objet.note2();">H</a>';
- echo'<a href="#1" onclick="Objet.note1();">H</a>';
- echo'</div>';
- JS:
- note1 : function(){
- var noteUn = document.getElementById('note').value = 1;
- },
- note2 : function(){
- var noteDeux = document.getElementById('note').value = 2;
- },
- note3 : function(){
- var noteTrois = document.getElementById('note').value = 3;
- },
- note4 : function(){
- var noteQuatre = document.getElementById('note').value = 4;
- },
- note5 : function(){
- var noteCinq = document.getElementById('note').value = 5;
- },
- CSS3:
- .rating a {
- float: right;
- color: #aaa;
- text-decoration: none;
- font-size: 3em;
- transition: color .4s;
- font-family: 'neoretrodrawregular';
- }
- .rating :hover,
- .rating a:focus,
- .rating a:hover ~ a,
- .rating a:focus ~ a {
- color: #F68A53;
- cursor: pointer;
- }
- .rating {
- direction: rtl;
- }
- .rating a {
- color: #aaa;
- text-decoration: none;
- font-size: 2.5em;
- transition: color .4s;
- }
- .rating a:hover,
- .rating a:focus,
- .rating a:hover ~ a,
- .rating a:focus ~ a {
- color: #F68A53;
- cursor: pointer;
- }
|
Si quelqu'un peut me donner une solution à mon problème je suis preneur ! CSS ou JS je prends.
Merci ! ---------------
L'écoconception n'est pas négociable - Topic habitats de demain : https://tinyurl.com/y5h2mjx7
|