欢迎投稿

菜鸟之家

当前位置:菜鸟之家 > jquery库 > 幻灯片和轮播图 > 响应式全屏滚动式jQuery图片画廊插件

响应式全屏滚动式jQuery图片画廊插件

响应式全屏滚动式jQuery图片画廊插件

关键词:全屏,图片画廊,滚动,jquery图片画廊插件,jquery图片画廊,jquery图片展示,jquery图片预览,jquery库,lunbo

描述:这是一款响应式全屏滚动式jQuery图片画廊插件。该插件可以创建一组全屏的图片,通过滚动鼠标滚轮,或者使用键盘的上下箭头按钮,或者在移动设备上通过上下滑动来切换图片的显示。

简要教程

这是一款响应式全屏滚动式jQuery图片画廊插件。该插件可以创建一组全屏的图片,通过滚动鼠标滚轮,或者使用键盘的上下箭头按钮,或者在移动设备上通过上下滑动来切换图片的显示。

使用方法

在页面中引入jquery和ssg.js、ssg.css文件。

<link href="css/ssg.css" rel="stylesheet"> 
<script type="text/javascript" src="js/jquery.min.js"></script>             
<script type="text/javascript" src="js/ssg.js"></script>                  
                
HTML

使用下面的结构创建一个图片缩略图布局。

<section class="gallery">

  <a href="large.jpg">
    <img src="thumb.jpg" alt="Image 1">
  </a>

  <a href="large.jpg">
    <img src="thumb.jpg" alt="Image 1">
  </a>

  <a href="large.jpg">
    <img src="thumb.jpg" alt="Image 1">
  </a>
  
</section>
                
初始化插件

在页面DOM元素加载完毕之后,通过下面的方法来初始化该响应式全屏滚动式jQuery图片画廊插件。

SSG.run();
                

配置参数

响应式全屏滚动式jQuery图片画廊插件的可用配置参数有:

SSG.run({

  // fullscreen or not
  fs: false, 

  // image object
  img: { href: "url", alt: "some text" }
  
});                    
                

响应式全屏滚动式jQuery图片画廊插件的github地址为:https://github.com/Roman-Flossler/Simple-Scroll-Gallery

说明:菜鸟之家所有素材均是用户自行上传分享并拥有版权或使用权,仅供网友学习交流,未经上传用户书面授权,请勿作他用。若您的权利被侵害,请联系QQ:11809283或发送邮件至11809283@qq.com。

菜鸟之家承诺:本站所有资源,无需注册,免费下载,无病毒,无弹窗,无干扰链接!

转载请注明出处!本文地址:http://www.jeeok.com/jquery_lunbo/9345.html

 在线演示  免费下载
编号:201809250000009345
大小:1.34MB
上传时间:2018-11-09 06:58
素材由用户"athena201jt"上传分享。

标签

最新推荐素材

与响应式全屏滚动式jQuery图片画廊插件相关的素材

.