首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

js+css实现上下翻页相册代码分享

Posted in Javascript onAugust 18, 2015

 这是一款基于js+css实现上下翻页相册特效代码，相册可以从上下两个方向进行切换，是一款非常实用的幻灯片特效源码。
 先为大家展示效果图：

js+css实现上下翻页相册代码分享

效果演示 源码下载

为大家分享的jQuery幻灯片带缩略图轮播代码如下

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 
 <title>js+css实现上下翻页相册</title>
 
 <link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
 <link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
 <link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
 
 <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
 <script type="text/javascript" src="js/demo.js"></script>
 </head>
 
 <body>
 <div class="container_12" id="wrapper">
 <div class="grid_8" id="content"><br /><br /><br /><br /><br /><br /><br />
 
 <!-- relevant for the tutorial - start -->
 <div class="grid_6 prefix_1 suffix_1" id="gallery">
  <div id="pictures">
  <img src="images/picture1.png" alt="" />
  <img src="images/picture2.png" alt="" />
  <img src="images/picture3.png" alt="" />
  <img src="images/picture4.png" alt="" />
  <img src="images/picture5.png" alt="" />
  </div>
  
  <div class="grid_3 alpha" id="prev">
  <a href="#previous">« Previous Picture</a>
  </div>
  <div class="grid_3 omega" id="next">
  <a href="#next">Next Picture »</a>
  </div>
 </div>
 <!-- relevant for the tutorial - end -->

  
 </body>
</html>

以上就是为大家分享的js+css实现上下翻页相册代码，希望大家可以喜欢。

js+css实现上下翻页相册代码分享

- Author -

lijiao

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
基于JQuery的一句代码实现表格的简单筛选
Jul 26 Javascript
jQuery 表单验证扩展(三)
Oct 20 Javascript
ANGULARJS中用NG-BIND指令实现单向绑定的例子
Dec 08 Javascript
jQuery控制cookie过期时间的方法
Apr 07 Javascript
jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
Feb 16 Javascript
JavaScript中的事件委托及好处
Jul 12 Javascript
微信小程序 POST请求（网络请求）详解及实例代码
Nov 16 Javascript
JavaScript之map reduce_动力节点Java学院整理
Jun 29 Javascript
分享5个好用的javascript文件上传插件
Sep 16 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
Sep 28 Javascript
node.js中path路径模块的使用方法实例分析
Feb 13 Javascript
jQuery+css实现的点击图片放大缩小预览功能示例【图片预览 查看大图】
May 29 jQuery
javascript实现图片上传前台页面
Aug 18 #Javascript
jquery使用ul模拟select实现表单美化的方法
Aug 18 #Javascript
jQuery实现的漂亮表单效果代码
Aug 18 #Javascript
jquery实现select下拉框美化特效代码分享
Aug 18 #Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
Aug 18 #Javascript
JS+DIV+CSS实现仿表单下拉列表效果
Aug 18 #Javascript
js模拟淘宝网的多级选择菜单实现方法
Aug 18 #Javascript
DBLink(1) 间隙锁(2) 复读(1) innoDB(3) .NET Framework(2) GZIP(2) 事务并发(1) IIS7(1) MVCC(4) 幻读(5)
You might like
php mssql 数据库分页SQL语句
2008/12/16 PHP
PHP 使用redis简单示例分享
2015/03/05 PHP
PHP实现指定字段的多维数组排序函数分享
2015/03/09 PHP
php多文件打包下载的实例代码
2017/07/12 PHP
php+ajax实现商品对比功能示例
2019/04/13 PHP
JS 实现双色表格实现代码
2009/11/24 Javascript
HTML中的setCapture和releaseCapture使用介绍
2012/03/21 Javascript
jquery移除、绑定、触发元素事件使用示例详解
2014/04/10 Javascript
JS对象是否拥有某属性如何判断
2017/02/03 Javascript
JavaScript基础进阶之数组方法总结(推荐)
2017/09/04 Javascript
实例分析js事件循环机制
2017/12/13 Javascript
vue自定义filters过滤器
2018/04/26 Javascript
React SSR样式及SEO的实践
2018/10/22 Javascript
「中高级前端面试」JavaScript手写代码无敌秘籍（推荐）
2019/04/08 Javascript
JS实现返回上一页并刷新页面的方法分析
2019/07/16 Javascript
基于JavaScript或jQuery实现网站夜间/高亮模式
2020/05/30 jQuery
用Python给文本创立向量空间模型的教程
2015/04/23 Python
django使用html模板减少代码代码解析
2017/12/12 Python
浅谈tensorflow1.0 池化层（pooling)和全连接层(dense)
2018/04/27 Python
解决python3中的requests解析中文页面出现乱码问题
2019/04/19 Python
python3的UnicodeDecodeError解决方法
2019/12/20 Python
Pytorch 使用不同版本的cuda的方法步骤
2020/04/02 Python
pandas针对excel处理的实现
2021/01/15 Python
MyFrenchPharma中文网：最大的法国药妆平台
2016/10/07 全球购物
家庭睡衣和家庭用品：Little Blue House
2018/03/18 全球购物
兰蔻法国官方网站：Lancôme法国
2020/02/22 全球购物
学前教育毕业生自荐信
2013/10/29 职场文书
写给老师的表扬信
2014/01/21 职场文书
小学毕业感言150字
2014/02/05 职场文书
行政专员的岗位职责
2014/03/10 职场文书
团购业务员岗位职责
2014/03/15 职场文书
某某同志考察材料
2014/05/28 职场文书
隐形的翅膀观后感
2015/06/10 职场文书
小学英语教师2015年度个人工作总结
2015/10/14 职场文书
浅谈node.js中间件有哪些类型
2021/04/29 Javascript
Nginx 反向代理解决跨域问题多种情况分析
2022/01/18 Servers