jQuery는 제품 자동 360도 회전 표시 특수 효과 소스 코드를 실현합니다.-JS 튜토리얼-php.cn

jQuery는 제품 자동 360도 회전 표시 특수 효과 소스 코드를 실현합니다.

WBOY

풀어 주다： 2016-05-16 15:43:48

원래의

1748명이 탐색했습니다.

jQuery를 기반으로 한 제품의 자동 360도 회전 표시를 위한 특수 효과 코드입니다. 제품을 360도 회전하여 표시할 수 있어 고객이 제품의 모든 외관 세부 사항을 더 잘 이해할 수 있습니다.

jQuery 제품 360도 회전 표시 코드는 사전 로드를 지원하며 제품 이미지를 빠르고 포괄적으로 미리 볼 수 있도록 여러 이미지를 사용하여 순차적으로 재생하는 것이 주요 원칙입니다. 모든 종류의 주류 브라우저를 위한 매우 뛰어난 특수 효과 소스 코드입니다.

실행 효과 다이어그램:----------------------효과 보기 소스코드 다운로드---------

jQuery로 구현한 제품의 자동 360도 회전 표시 효과를 여러분께 공유하는 코드는 다음과 같습니다

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery产品360度旋转展示代码</title>
<link href="360show.css" rel="stylesheet" type="text/css">

<script src="jquery.min.js"></script>
<script type="text/javascript" src="360show.js" ></script>
</head>
<body>
<div id="box-wrapper">
 <div class="box-control box-control-left"><a title="顺时针转动" href="javascript:void(0)" class="prev" id="prev"></a></div>
 <div id="mask"><em class="loading">
  <p>loading</p>
  </em></div>
 <div id="box" path_pattern='img/###.png'></div>
 <div id="imgbox"></div>
 <div class="box-control box-control-right"><a title="逆时针转动" href="javascript:void(0)" class="next" id="next"></a></div>
</div>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>

</div>
</body>
</html>

로그인 후 복사

위 내용은 jQuery로 구현한 제품에 대한 자동 360도 회전 표시 특수 효과 코드입니다. 마음에 드셨으면 좋겠습니다.