js 이미지 캐러셀 수동 전환 effect_javascript 기술-JS 튜토리얼-php.cn

js 이미지 캐러셀 수동 전환 effect_javascript 기술

WBOY

풀어 주다： 2016-05-16 15:32:55

원래의

1540명이 탐색했습니다.

ScrollPicLeft.js 라이브러리를 사용하여 사진을 앞뒤로 전환할 수 있습니다. 이는 웹페이지의 인증서 표시 및 추천 제품과 같은 열에 적합합니다. 기존의 선택 윤곽 스크롤과는 달리 수동으로 앞으로 및 뒤로 전환 화살표 버튼을 클릭하여 사진 페이지를 넘길 수 있어 이전 사진과 다음 사진을 탐색하는 효과를 얻을 수 있습니다.
jquery를 호출할 필요가 없으며 초기화가 간단하고 사용이 매우 간단하고 편리합니다.
효과 예시:

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>

로그인 후 복사

이 기사의 예에서는 js 이미지 캐러셀의 수동 전환 효과를 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.
js 이미지 캐러셀 기반의 수동 전환 효과 코드이며, 구현 과정은 매우 간단합니다.
모든 사람과 공유하는 js 이미지 캐러셀 효과를 수동으로 전환하는 코드는 다음과 같습니다



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>