ปลั๊กถูกเขียนโดยผู้เขียนบล็อกนี้
โครงการมือถือของ บริษัท ขึ้นอยู่กับ Zepto ดังนั้นฉันจึงไปที่เว็บไซต์ทางการของ Zepto เพื่อดู API แต่พบว่าหากคุณต้องการใช้วิธี Zepto Swipe () คุณต้องอ้างไฟล์ Touch.js ที่ได้รับการบรรจุ เว็บไซต์อย่างเป็นทางการไม่สามารถนำไปใช้กับวิธีการปัด () ดังนั้นจึงสับสนและตรวจสอบข้อมูลต่อไป เหตุผล ต่อมาฉันค้นพบ touch.js ที่พัฒนาโดยทีม Baidu Clouda Clouda (ในปัจจุบัน JS ได้รับการดูแลโดยทีมงานนี้) ผลลัพธ์ก็โอเค! ขอบคุณทีม Clouda ของ Baidu Cloud ที่นี่คุณเป็นวัวจริงๆ! จุดตัด จุดตัด ให้ความสนใจที่นี่ว่า Zepto ไม่มีวิธีการเคลื่อนไหว ()
หากคุณคิดว่าปลั๊กนี้มีข้อบกพร่องหรือข้อบกพร่องโปรดฝากข้อความไว้ฉันจะแก้ไขทันเวลาขอบคุณ!
ต่อไปนี้เป็นรหัสที่สมบูรณ์ที่กลิ้งขึ้นไปอย่างราบรื่นขึ้นอยู่กับเทอร์มินัลมือถือของ Zepto และแตะปลั๊กเลื่อนขึ้นและลง:
ส่วน HTML:
<! ไม่> เอกสารที่ไม่ใช่ชื่อ </title> <style>*{margin: 0; ซ่อนเร้น; > <ul> <li> 111111111111222222 </li> <li> 2222222202 </li> <li> 3333333303 </li> <li> 4444444404 </li> <li> 555555505 Li> <li> 1111111111 </li> <li> 2222222202 </li> <li> 3333333303 </li> <li> 4444444404 </li> <li> 555555505 </li> /ul> </div> <script src = zepto.min.js> </script> <script src = fx.js> </script> <script src = touch-0.2.14.js> </script> สคริปต์ src = zepto.textslider.js> </script> <script> $ (function () {$ () {$ (. box) .TextSlider ({ความเร็ว: 50 ยิ่งค่าของค่ายิ่งขึ้น เส้นความเร็ว: 10 / /แตะจำนวนม้วน}));}) </script> </body>ปลั๊ก -in zepto.textslider.js ส่วน:
/ ** textslider 0.1* ลิขสิทธิ์ (c) 2014 tnnyang* การพึ่งพา zepto v1.1.6 & fx.js & touch-0.min.js* ผู้แต่งโดย*/ (ฟังก์ชั่น ($) {$ .fn.Text Slider = function ( ตัวเลือก) {// การกำหนดค่าเริ่มต้น var defaults = {ความเร็ว: 40, // ความเร็วในการกลิ้ง, ค่าที่ใหญ่ขึ้น, ยิ่งช้าลงจำนวนแถว: 1 // การหมุนบรรทัด}; , {} ,, ค่าเริ่มต้น, ตัวเลือก); .find (ul) .animate ({margintop: margintop}, 0, function () {var s = math.abs (parseint ($ (นี่) .css (margin-top)); ถ้า (s> = 20) { top = 0; สิ่งนี้));}});}, _speed); (ul); ถ้า ($ ul.height ()> _this.head ()) {Marquee (_this, speed);} // touch start_this.on ('touchstart', ฟังก์ชั่น (ev) {ev.preventdefault (); erval ($ timer);}); ) {สำหรับ (i = 0; i <opts.line; i ++) {$ ul.find (li). First () ;}}); i = 0; มาร์จิ้น (มาร์จิ้น (มาร์จิ้น (มาร์จิ้น (มาร์จิ้น -ท็อป, 0);}}); // จุดสิ้นสุดของ touch_this.on ('touchend', ฟังก์ชั่น (ev) {ev.preventdefault () ()> _this.heigh ())) {) {) {) {) {marquee (_this, ความเร็ว);}});});}});ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้