3D旋转图片轮播特效

所属分类：媒体-幻灯片和轮播图

115145 544 查看评论 (44)

分享到微信朋友圈

查看演示立即下载

插件描述：3D旋转图片轮播特效

step 1: 引入css样式表

<link rel="stylesheet" type="text/css" href="css/css.css">

step 2:引入js文件

<script type="text/javascript" src="js/ZoomPic.js"></script>

step 3:调用插件函数

<script type="text/javascript">
    $(function(){
	new ZoomPic("jswbox");	
    })
</script>

step4:插入html代码

<div id="jswbox">
	<pre class="prev">prev</pre>
	<pre class="next">next</pre>
	<ul>
		<li><img src="images/1.jpg" alt="derrick" /></li>
		<li><img src="images/2.jpg" alt="MAGGIE" /></li>
		<li><img src="images/3.jpg" alt="许在浩" /></li>
		<li><img src="images/4.jpg" alt="颜子超" /></li>
		<li><img src="images/5.jpg" alt="万玲玲" /></li>
		<li><img src="images/6.jpg" alt="derrick" /></li>
		<li><img src="images/7.jpg" alt="MAGGIE" /></li>
	</ul>
</div>

===========感谢会员只看不发了提供的内容===============

jquery验证插件Validator

JS超炫切换效果焦点图代码

可拖动的轮播插件（视频存在进度条，swiper插件）

可以拖拽实现切换图片，可以将图片和视频一起实现滑动。视频存在进度条，进度条完毕，实现切换

幻灯片和轮播图

40736 376

超棒的响应式幻灯jQuery插件 - refineslide

今天我们介绍的这个幻灯插件能够帮助我们使用响应式的方式展示图片幻灯，最重要的在于它支持很多超棒的CSS3幻灯过渡效果，能够帮助你创建超酷的幻灯效果。

幻灯片和轮播图

24037 355

图片标题轮播

幻灯片插件，它非常小巧，压缩后仅 1.34KB，功能也不算丰富，圆点控制、自动播放。

幻灯片和轮播图

35816 422

jQuery图片切换插件Slides

Slides是一个jQuery插件用于将一组图片组织成一个好看的幻灯片展示控件。支持：循环、自动播放、淡入/淡出幻灯片切换效果，交叉淡入淡出，图片预加载，自动产生分页。

幻灯片和轮播图

54610 388

讨论这个项目（44）回答他人问题或分享插件使用方法奖励jQ币评论用户自律公约

霜序五日 0

2020/8/22 18:51:05

西瓜0

2020/8/22 19:43:51

这个不存在图片格式问，影响的只有图片的大小和路径这两个问题。

kvb753 0

2020/4/24 15:25:09

闲行 0

2019/11/26 9:09:43

故旅 0

2019/10/21 17:41:57

萌新求问，为什么我拿过来还好好的，放到ajax里面加载自己的数据就报错了。。。。

ZoomPic.js:17 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
    at ZoomPic.setUp (ZoomPic.js:17)
    at ZoomPic.initialize (ZoomPic.js:4)
    at new ZoomPic (ZoomPic.js:2)
    at HTMLDocument.<anonymous> (HtmlTemplate2.html:46)
    at i (jquery-1.12.4.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-1.12.4.min.js:2)
    at Function.ready (jquery-1.12.4.min.js:2)
    at HTMLDocument.K (jquery-1.12.4.min.js:2)