Le plug -in est écrit par l'auteur de ce blog.
Le projet mobile de l'entreprise est basé sur Zepto. Je suis donc allé sur le site officiel de Zepto pour afficher son API, mais j'ai constaté que si vous souhaitez utiliser la méthode Zepto Swipe (), vous devez citer le fichier Touch.js qu'il a été emballé. Le site officiel ne peut pas être appliqué à la méthode Swipe (), il est donc confus et continue de vérifier les informations. La raison. Plus tard, j'ai découvert par inadvertance un Touch.js développé par l'équipe Baidu Cloud Clouda (à l'heure actuelle, le JS est également maintenu par cette équipe). Le résultat est ok! Grâce à l'équipe Clouda de Baidu Cloud ici, vous êtes vraiment de la vache! Intersection Intersection Faites attention ici que Zepto lui-même n'a pas la méthode Animate ().
Si vous pensez que cette fiche a des bogues ou des lacunes, veuillez laisser un message, je le modifierai à temps, merci!
Ce qui suit est le code complet qui a roulé de manière transparente vers le haut en fonction du terminal mobile de Zepto et touchez la fiche coulissante de haut en bas:
HTML PARTIE:
<! NON> <Titre> Documents non titlé Hidden; Border: 1px solide #ccc; > <ul> <li> 1111111111222222 </li> <li> 2222222202 </li> <li> 333333303 </li> <li> 4444444404 </li> <li> 55555555505 </li> <li> 666666606 </fr Li> <li> 111111111 </li> <li> 22222222202 </li> <li> 3333333303 </li> <li> 4444444404 </li> <li> 5555555505 </li> <li> 6666666606 </li> / Ul> </ div> <script src = zepto.min.js> </ script> <script src = fx.js> </ script> <script src = touch-0.2.14.js> </ script> < script src = zepto.textslider.js> </cript> <cript> $ (function () {$ () {$ (. box) .textslider ({speed: 50, plus la valeur de la valeur est grande, plus le lentement le plus Ligne de vitesse: 10 / / touchez le nombre de rouleaux}));}) </cript> </ body>
Plug -in zepto.textslider.js Pièce:
/ ** TextsLider 0.1 * Copyright (C) 2014 Tnnyang * dépendance Zepto v1.1.6 & fx.js & touch-0.min.js * Auteur par * / (fonction ($) {$ .fn.text slider = function ( Options) {// Configuration par défaut var par défaut = {Speed: 40, // Retling Speed, plus la valeur est grande, plus le nombre de lignes: 1 // ligne de roulement}; , {} ,, par défaut, options); .find (ul) .animate ({margintop: margintop}, 0, function () {var s = math.abs (parseInt ($ (this) .css (margin-top)); if (s> = 20) { top = 0; this));}});}, _speed);} this.each (function () {varulaed = opts [Spee (ul); if ($ ul.Height ()> _This.head ()) {Marquee (_This, Speed);} // Touch Starts_This.on ('TouchStart', fonction (ev) {ev.preventDefault (); Erval ($ timer);}); )) {pour (i = 0; i <opts.line; i ++) {$ ul.find (li) .First (). ; i = 0; i <Options.Le marge (marge (marge (marge (marge -top, 0);}}); // la fin du touch_this.on ('touchend', fonction (ev) {ev.preventdefault (); if ($ ul.heryigh ()> _This.Heigh ())) {) {) {) {) {Marquee (_This, Speed);}});});}}); zepto);
Ce qui précède est tout le contenu de cet article.