Ajuster temporairement la hauteur de l'élément en vol stationnaire

Question

J'ai une étiquette <h3> avec une hauteur limitée (100 px par exemple, la position: absolute) et le texte déborde il.

Ce que je voudrais faire est de glisser vers le bas sur la hauteur qui est nécessaire lorsque la souris est au-dessus et à l'arrière à la hauteur d'origine (100px).
J'espère que vous comprenez ce que je veux dire

Je ne pense pas qu'il utilise la fonction slideDown () pour cela et je suis très faible en fonction Animer. Toute aide s'il vous plaît?

Answer 1

Vous pouvez imbriquer un div dans la h3 qui contient le contenu, puis utiliser le h3 comme un conteneur de masquage (débordement d'utilisation: caché). Lorsque les utilisateurs sur mouses, le feu d'une fonction get est la hauteur de la div intérieur (assurez-vous d'inclure des marges ou padding). Ensuite, vous exécutez la fonction réglage de la hauteur Animer (En jquery, quelque chose comme $('h3').animate({height: heightVar});) Le mouseout déclenche une fonction qui restaure la hauteur du dos h3 à 100px.

Voici un exemple: http://jsfiddle.net/XR9fb/

Answer 2

Vous pouvez obtenir la hauteur réelle de l'élément avec la propriété scrollHeight. Maintenant, je ne sais pas vraiment beaucoup de jQuery, mais je suppose que vous pourriez appeler Animer pour définir la propriété CSS hauteur au scrollHeight de l'élément lorsque les survols de la souris et le retourner à la hauteur d'origine lorsque la souris se déplace sur il.

Si la hauteur de l'élément est pas résolu, vous pouvez le Salve quelque part actuelle de la hauteur avant d'afficher l'élément complet, et lorsque la souris quitte l'élément que vous reconstitue tout cet état.