jQuery masquer le texte, l'affichage sur le vol stationnaire?

Espérons-le, juste une petite question 🙂

Je suis en train d'écrire peu de jQuery qui va aider à faire cela:

  • texte affiché sur la page: CA
  • texte affiché lorsque la souris survole: CALIFORNIE

J'ai réussi à le faire dans le mauvais sens malheureusement, je sais que j'ai besoin d'utiliser l' .hide() la fonction mais je n'arrive pas à comprendre comment l'utiliser. Désolé, je suis assez nouveau à jQuery et juste essayer d'obtenir ma tête autour de lui.

Voici un jfiddle j'ai fait lien, de préférence le texte de la diapositive à partir de la droite. J'ai essayé d'utiliser un span, mais il semblait mieux avoir les balises p dans les différentes divisions. Je comprends que je vais avoir besoin de mettre le code HTML sur une seule ligne pour se débarrasser du peu d'espace entre le CA et LIFORNIA. n'importe qui pourrait éventuellement s'il vous plaît aider?

HTML:

<div class="state">
     <p>CA</p>
</div>
<div class="state-full">
     <p>LIFORNIA</p>
</div>

CSS:

.state, .state-full {
     display: inline-block;
     cursor: pointer;
}

jQuery:

$('.state').hover(function() {
     $('.state-full').slideToggle(100, 'linear');
     $('.state-full').display(100, 'linear');
});

Merci beaucoup!

InformationsquelleAutor LT86 | 2012-12-07