L'utilisation de deux boutons (images) pour faire défiler une DIV qui est fixé à " overflow: hidden; avec jQuery
j'ai un div conteneur:
.mask {
height: 157px;
overflow: hidden;
}
le contenu à l'intérieur de ce conteneur est plus que 157px. j'ai deux liens (images) que je veux utiliser pour faire défiler le contenu à l'intérieur du conteneur vers le haut ou vers le bas:
<ul class="scroll">
<li><a href="#"><img src="img/text-down-icn.png" alt="scroll down" /></a></li>
<li><a href="#"><img src="img/text-up-icn.png" alt="scroll up" /></a></li>
</ul>
comment puis-je obtenir ces deux liens pour faire défiler le contenu de l'intérieur du conteneur?
merci beaucoup
===========================================
Merci pour votre aide. Il s'avère que cela fonctionne mieux à l'aide de la scrollTo Plugin (http://plugins.jquery.com/project/ScrollTo).
$(document).ready(function(){
$(".down").click(function () {
$('.mask').scrollTo( '+=156px', 500 );;
});
$(".up").click(function () {
$('.mask').scrollTo( '-=156px', 500 );;
});
});
OriginalL'auteur maze | 2011-06-28
Vous devez vous connecter pour publier un commentaire.
Si vous souhaitez utiliser onmouseover et onmouseout événement vous pouvez utiliser quelque chose comme ça :
onmouseover :
et onmouseout vous effacer la minuterie :
OriginalL'auteur Tim
Voici un code qui fonctionne 🙂 Vous aurez besoin d'ajouter un peu de style à prévenir les boutons de déplacement trop. Ajouter le "fixe" de position pour les boutons.
Essentialyl ce qui se passe ici est que le contenu est déplacé vers le haut/vers le bas dans/hors du récipient, faire apparaître à défiler. Tandis que les boutons eux-mêmes, sont intactes!
Espère que c'est de l'utiliser 🙂
OriginalL'auteur Chris
Vous pouvez consulter ces exemples pour apprendre à mettre en œuvre ou de l'utiliser directement pour obtenir la tâche accomplie:
1- HoverScroll plugin jQuery
2- jCarousel
3- Lisse De Défilement Div
OriginalL'auteur Mohammed Swillam