Faites défiler 4 extraits de code d'assistance

J'utilise le plugin Iscroll 4 et c'est très bien. Je l'utilise pour implémenter des barres de défilement adaptées à un excellent plugin. Si j'ai le temps, j'écrirai une API d'extension pour cela et j'écrirai des démos (si l'intérêt est assez grand). Mais maintenant, voici quelques extraits de code.

// 下面代码片段的设置
var scrollName = 'myScroll',
     scrollDuration = 1000,
    scrollAmount = 200;

Définissez le défilement avec la fonction de rappel d'extrémité de défilement.

// 设置滚动并带有滚动结束回调函数
window[scrollName] = new iScroll(scrollName, {
    onScrollEnd: function() {
        console.log('onScrollEnd');
        // 在滚动结束时执行某些操作
    }
});

Vérifiez si le défilement est en haut du contenu.

// 检查滚动是否位于内容顶部
window[scrollName].y

Vérifiez si le défilement est au bas du contenu.

// 检查滚动是否位于内容底部
window[scrollName].y == window[scrollName].maxScrollY

Faites défiler vers le haut du contenu.

// 滚动到内容顶部
window[scrollName].scrollTo(0, 0, scrollDuration);

// 或
window[scrollName].scrollTo(0, 0);

Faites défiler relatif vers le haut.

// 相对向上滚动
window[scrollName].scrollTo(0, '-'+scrollAmount, scrollDuration, true);

Faites défiler vers le bas les uns par rapport aux autres.

// 相对向下滚动
window[scrollName].scrollTo(0, scrollAmount, scrollDuration, true);

// Sinon, initialisez le défilement sur la fenêtre modale bootstrap

if (!window[scrollName].wrapper) {
    // 它需要可见才能工作...
    setTimeout(function() {
        console.log('modal iscroll...');
        console.log(scrollName);
        window[scrollName] = new iScroll(scrollName);
    }, 10);
}

FAQ pour les événements d'extrémité ISCroll et Scroll (FAQ)

Quelle est la principale différence entre les événements ISCROLL et Scroll End?

ISCROLL est un petit défilement JavaScript multiplateforme de petite performance et sans espace. Il fonctionne sur des ordinateurs de bureau, des appareils mobiles et des téléviseurs intelligents. Il est conçu pour gérer différents types d'événements et est hautement personnalisable. D'un autre côté, l'événement d'extrémité de défilement est un événement plus spécifique qui est déclenché une fois l'opération de défilement terminée. Il fait partie de l'API Web et n'est pas aussi personnalisable qu'Iscroll.

Comment utiliser Iscroll dans mon projet?

Pour utiliser ISCroll dans votre projet, vous devez inclure le fichier JavaScript Iscroll dans le fichier HTML. Après cela, la nouvelle instance Iscroll peut être initialisée en appelant le constructeur ISCroll avec l'ID de l'élément à défiler. Vous pouvez également transmettre un objet d'option pour personnaliser le comportement du défilement.

Puis-je utiliser Iscroll avec React ou d'autres frameworks JavaScript?

Oui, Iscroll peut être utilisé avec n'importe quel cadre JavaScript, y compris React, Angular, Vue, etc. Assurez-vous simplement que l'instance ISCROLL est initialisée après que le framework ait rendu le DOM.

Comment écouter les événements d'extrémité de défilement?

Vous pouvez utiliser la méthode addEventListener sur l'élément que vous souhaitez surveiller pour écouter les événements d'extrémité de défilement. La fonction d'écoute d'événements est appelée chaque fois qu'une opération de défilement est terminée sur cet élément.

Puis-je personnaliser le comportement de l'événement d'extrémité de défilement?

L'événement d'extrémité de défilement lui-même ne peut pas être personnalisé car il fait partie de l'API Web. Cependant, vous pouvez personnaliser ce qui se passe lorsqu'un événement est déclenché en définissant votre propre fonction d'écoute d'événements.

Quels sont les cas d'utilisation courants d'Iscroll?

ISCROLL peut être utilisé dans une variété de situations lorsque des rouleaux personnalisables à haute performance sont nécessaires. Certains cas d'utilisation courants incluent des applications Web mobiles, des applications à page unique et des jeux Web.

Quels sont les cas d'utilisation courants pour les événements d'extrémité de défilement?

L'événement d'extrémité de défilement est généralement utilisé lorsque vous devez savoir quand l'opération de défilement est terminée. Ceci est utile pour le chargement retardé du contenu, le défilement infini ou le déclenchement d'animations en fonction de la position de défilement.

Quels sont les problèmes ou limitations connues d'Iscroll?

Iscroll est une bibliothèque mature et bien entretenue, mais comme tout logiciel, il peut avoir certains problèmes ou limitations. Ceux-ci sont généralement enregistrés dans le référentiel GitHub du projet.

Quels sont les problèmes ou limitations connus pour l'événement d'extrémité de défilement?

L'événement d'extrémité de défilement fait partie de l'API Web, donc son comportement doit être cohérent dans tous les navigateurs modernes. Cependant, dans les navigateurs plus âgés, il peut y avoir des différences dans la façon dont il est mis en œuvre.

Où puis-je trouver plus d'informations sur les événements ISCroll et Scroll End?

Plus d'informations sur ISCroll peuvent être trouvées sur son site officiel et sur le référentiel GitHub. Pour plus d'informations sur la fin des événements de défilement, veuillez vous référer à la documentation Web du Mozilla Developer Network (MDN).

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!