# ThScroll

**Repository Path**: erroot/ThScroll

## Basic Information

- **Project Name**: ThScroll
- **Description**: jQuery滚动预览缩略图特效插件,
- **Primary Language**: JavaScript
- **License**: MulanPSL-1.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-10-12
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# ThScroll

#### 介绍
jQuery滚动预览缩略图特效插件,

#### 软件架构
软件架构说明


#### 安装教程

下载解压到本地web目录

#### 使用说明

1. 引入css  <link rel="stylesheet" type="text/css" href="css/ThScroll.css">
2. 声明容器 <div id="content-6" class="content" style="height: 200px;width:900px"></div>
3. 引入JS	
    <script src="js/jquery-1.11.0.min.js"></script>
	<script src="js/ThScroll.js"></script>

4 初始化
    
	<script>
		(function($){
			$(window).load(function(){
			
				var data = [
					{image:"thumbnails/img1.jpg"},
					{image:"thumbnails/car1.jpg",video:"http://127.0.0.1/cyai/assets/ckplayer/material/test.mp4"},
					{image:"thumbnails/img2.jpg"},
					{image:"thumbnails/img3.jpg",video:"http://127.0.0.1/cyai/assets/ckplayer/material/test.mp4"},
					{image:"thumbnails/img4.jpg"},
					{image:"thumbnails/img5.jpg"},
					{image:"thumbnails/img6.jpg"},
					{image:"thumbnails/img7.jpg"},
					{image:"thumbnails/img8.jpg"},
					{image:"thumbnails/img9.jpg"}
				];
			
				function imgClickFunc(obj){
					console.log(obj);
					alert("imgClck");
				}
			
				ThScroll.initFromJsonArr(data,{selector:"#content-6",imgItemClickCb:imgClickFunc});
				
			});
			
		})(jQuery);
	</script>

#### 参与贡献

1. 特别鸣谢 代码主要扒自“jQuery多功能滚动预览缩略图特效插件” http://www.htmleaf.com/jQuery/Slideshow-Scroller/201506202071.html

#### 运行截图
![运行截图](https://images.gitee.com/uploads/images/2019/1012/170653_cefd1b33_1807457.jpeg "ThScroll1.jpg")

#### 项目截图
![视频预览](https://images.gitee.com/uploads/images/2019/1012/170729_d175421e_1807457.jpeg "ThScroll2.jpg")
![图片预览](https://images.gitee.com/uploads/images/2019/1012/170756_55d248fc_1807457.jpeg "ThScorll3.jpg")