Rumah > hujung hadapan web > tutorial js > js image carousel manual switching effect_javascript kemahiran

js image carousel manual switching effect_javascript kemahiran

WBOY
Lepaskan: 2016-05-16 15:32:55
asal
1537 orang telah melayarinya

Gunakan perpustakaan ScrollPicLeft.js untuk menukar gambar ke belakang dan ke belakang, yang sesuai untuk lajur seperti paparan sijil dan produk yang disyorkan pada halaman web. Ia bukan seperti menatal marquee tradisional Sebaliknya, anda boleh mengklik butang anak panah beralih ke hadapan dan ke belakang secara manual untuk membelek halaman gambar, untuk mencapai kesan menyemak imbas gambar sebelumnya dan seterusnya.
Tidak perlu memanggil jquery, permulaan mudah, sangat mudah dan mudah digunakan.
Contoh kesan:

kod js:

<script type="text/javascript">
 var scrollPhoto = new ScrollPicleft();
 scrollPhoto.scrollContId = "ISL_Photo"; // 内容容器ID""
 scrollPhoto.arrLeftId = "Left_Photo";//左箭头ID
 scrollPhoto.arrRightId = "Right_Photo"; //右箭头ID
 scrollPhoto.frameWidth = 450;//显示框宽度
 scrollPhoto.pageWidth = 150; //翻页宽度
 scrollPhoto.speed = 10; //移动速度(单位毫秒,越小越快)
 scrollPhoto.space = 10; //每次移动像素(单位px,越大越快)
 scrollPhoto.autoPlay = false; //自动播放
 scrollPhoto.autoPlayTime = 3; //自动播放间隔时间(秒)
 scrollPhoto.initialize(); //初始化 
</script>
Salin selepas log masuk

Contoh dalam artikel ini menerangkan kesan pensuisan manual bagi karusel imej js. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:
Ini ialah kod kesan pensuisan manual berdasarkan karusel imej js, dan proses pelaksanaannya sangat mudah.
Kod untuk menukar secara manual kesan karusel imej js yang dikongsi dengan semua orang adalah seperti berikut



js图片轮播手动切换效果





<script type="text/javascript"> var scrollPhoto = new ScrollPicleft(); scrollPhoto.scrollContId = "ISL_Photo"; // 内容容器ID"" scrollPhoto.arrLeftId = "Left_Photo";//左箭头ID scrollPhoto.arrRightId = "Right_Photo"; //右箭头ID scrollPhoto.frameWidth = 450;//显示框宽度 scrollPhoto.pageWidth = 150; //翻页宽度 scrollPhoto.speed = 10; //移动速度(单位毫秒,越小越快) scrollPhoto.space = 10; //每次移动像素(单位px,越大越快) scrollPhoto.autoPlay = false; //自动播放 scrollPhoto.autoPlayTime = 3; //自动播放间隔时间(秒) scrollPhoto.initialize(); //初始化 </script>
Salin selepas log masuk

Muat turun kod sumber: kesan penukaran manual karusel imej js

Di atas ialah kod kesan penukaran manual karusel imej js yang dikongsi dengan anda.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan