javascript - carta karusel js asli

Question

Baru-baru ini bermain-main dengan imej karusel js asli

Saya menambah peralihan kepada pensuisan, jadi terdapat masalah sambungan yang besar dari gambar terakhir ke gambar pertama.

Ideanya adalah untuk menambahkan gambar pertama selepas gambar terakhir, dan kemudian keluarkan gambar pertama daripada elemen induk

1231 cara berfikir begini

Ada mana-mana master yang telah menulis kod serupa Anda boleh merujuknya

Answer 1

Saya buat satu, berdasarkan logik syaitan seks Makcik Zhang.

Susunannya ialah: 1 2 3 4 5 1

Gambar terakhir bertukar kepada gambar pertama, dan 1 terakhir dipaparkan. Kerana ia berurutan, luncuran itu licin seperti sutera.

Kunci: Selepas 5 hingga 1, pulihkan terus width: 0 Pada masa ini, ia kembali ke keadaan awal Kerana semua 1 dipaparkan, hampir tiada kecacatan.

Saya juga cuba mengalihkannya ke penghujung barisan setiap kali saya meluncurkannya, tetapi ia terlalu menyusahkan untuk dilaksanakan dan saya berputus asa.

Answer 2

Tidak perlu mengalih keluar, cuma tambahkan nod sedia ada untuk mengalihkannya. Kemudian tiba masanya untuk menukar bar skrol.

Answer 3

https://github.com/cubiq/Swip...
Peluncur pertama saya berdasarkan ini, ditulis oleh pengarang IScroll

Answer 4

Tiada keperluan untuk itu, dan lebih sedikit operasi pada nod DOM, lebih baik Contohnya, jika anda menggunakan urutan pengisihan ini 5 1 2 3 4 5 1,
Apabila menatal dari 5 ke 1 ke kanan, saat itu. animasi selesai, untuk kelas dengan peralihan, laraskan semula kedudukan kepada 1 pertama, dan kemudian tetapkan semula kelas dengan peralihan Begitu juga dari 1 hingga 5 ke kiri. Prinsipnya adalah menggunakan penipuan visual, kerana 2 pertama dan 1 selepas 5 di sebelah kanan mempunyai gaya yang sama dan tidak ada perbezaan, jadi tujuan boleh dicapai.