Maison > Article > interface Web > jquery texte sur une seule ligne effet de défilement vers le haut example_jquery

jquery texte sur une seule ligne effet de défilement vers le haut example_jquery

WBOYoriginal: 2016-05-16 16:56:341100parcourir

Copier le code Le code est le suivant :

Regardez le texte à défilement intermittent

 🎜> 

L'exposition CCTV 315 : China Resources est profondément impliquée dans la réponse de la "Haisha Gate" est claire mais pas clair

Yoshinoya a été exposé pour ne pas avoir stérilisé la vaisselle, Bosideng et d'autres pulls en cachemire ne contenaient pas de cachemire

La police de Wuxi a annoncé l'incident d'"un incident inattendu malheur pour une policière enceinte"

Une journée en Chine : La dernière vision du ferry : "Fais-le" à la maison

 ;

Copier le code Le code est tel suit :

.infolist{width:400px;matgin :0;}

.infolist ul{margin:0;padding:0;} 
.infolist ul li{list-style :aucun;hauteur:26px;hauteur de ligne:26px;} 
.infocontent {width:400px;hauteur:26px;débordement:hidden;border:1px solid #666666;} 

 

Copier le code Le code est le suivant :

var interval=1000;//L'intervalle de temps entre deux scrolls

var stepsize=26;//La longueur d'un défilement doit être une hauteur de ligne multiple, afin que les lignes ne se cassent pas lors du défilement 
var objInterval=null 

$(document).ready( function(){ 
//Remplissez la partie inférieure avec la partie supérieure
$ ("#bottom").html($("#top").html()); 

/ /Lier les événements de la souris à la zone affichée
$("#content").bind ("mouseover",function(){StopScroll();}); 
$("#content").bind(" mouseout",function(){StartScroll();}); 

 //Démarrer le minuteur
StartScroll(); 
}); 

//Démarrer le minuteur et commencer le défilement
function StartScroll(){ 
objInterval=setInterval("verticalloop( )",interval); 
} 

//Effacer le minuteur et arrêter le défilement
function StopScroll( ){ 
window.clearInterval(objInterval); 
} 

//Control scrolling
function verticalloop(){ 
//Détermine si tout le contenu supérieur a été déplacé hors du zone d'affichage
//Si c'est le cas, recommencez à zéro ; sinon, continuez à avancer vers le haut
if($( "#content").scrollTop()>=$("#top").outerHeight() ){ 
$("#content").scrollTop($("#content").scrollTop()- $("#top").outerHeight() 
} 
//Utiliser jquery pour créer un effet d'animation lors du défilement
$("#content").animate( 
{"scrollTop" : $("#content").scrollTop() stepsize "px"},600,function( ){ 
//Ceci est utilisé pour afficher le scrollTop de la zone de défilement. Dans les applications réelles, veuillez supprimer 
// $( "#foot").html("scrollTop:" $("#content" ).scrollTop()); 
}); 
} 

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：5 compétences de débogage essentielles pour les compétences JS debugging_javascriptArticle suivant：5 compétences de débogage essentielles pour les compétences JS debugging_javascript

Articles Liés

Voir plus