MovingBoxes左右滑动放大图片插件
MovingBoxes左右滑动放大图片插件在产品预览时很有用哦
实例代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MovingBoxes滑动放大图片插件</title>
<link type="text/css" href="/api/jq/5733e358c8829/css/style.css" rel="stylesheet">
<script type="text/javascript" src="/api/jq/5733e358c8829/js/jquery.js"></script>
<script type="text/javascript" src="/api/jq/5733e358c8829/js/jquery.movingboxes.js"></script>
<script type="text/javascript">
$(function() {
$('#focus').movingBoxes({
startPanel: 1, // 从第一个li开始
reducedSize: .5, // 缩小到原图50%的尺寸
wrap: true, // 是否无缝循环
buildNav: false, // 是否显示分页
navFormatter: function() {
return "●";// 返回分页格式
}
});
});
</script>
</head>
<body>
<!-- 代码开始 -->
<ul id="focus">
<li><a href="#" ><img src="/api/jq/5733e358c8829/images/img01.jpg"></a></li>
<li><a href="#" ><img src="/api/jq/5733e358c8829/images/img02.jpg"></a></li>
<li><a href="#" ><img src="/api/jq/5733e358c8829/images/img03.jpg"></a></li>
<li><a href="#" ><img src="/api/jq/5733e358c8829/images/img04.jpg"></a></li>
<li><a href="#" ><img src="/api/jq/5733e358c8829/images/img05.jpg"></a></li>
</ul>
<!-- 代码结束 -->
</body>
</html>
MovingBoxes左右滑动放大图片插件的更多相关文章
- jquery手指触摸滑动放大图片的方法(比较靠谱的方法)
jquery手指触摸滑动放大图片的方法(比较靠谱的方法) <pre><!DOCTYPE html><html lang="zh-cn">< ...
- Ionic实战三：Ionic 图片预览可放大缩小左右滑动demo-iClub图片预览
这个demo的主要功能有两个,一个是首页的导航向上拉动会浮动在最上面的效果,另一个就是我们平时非常实用的功能,就是图片预览功能 点击可以放大图片,并且可以左右滑动,还可以双击放大缩小图片以及双手指控制 ...
- jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片（仿相册插件）
该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...
- jQuery.hhLRSlider 左右滚动图片插件
/** * jQuery.hhLRSlider 左右滚动图片插件 * User: huanhuan * QQ: 651471385 * Email: th.wanghuan@gmail.com ...
- jQuery-单击文字或图片内容放大显示效果插件
css很强大,jQuery也很强大,两者结合在一起就是无比强大.这里要介绍的这个单击文字或图片内容放大居中显示的效果就是这两者结合的产物. 先来介绍css和jQuery各自发挥了什么作用吧: css: ...
- 手机端图片插件可缩放 旋转 全屏查看photoswipe
官方介绍PhotoSwipe 是专为移动触摸设备设计的相册/画廊.兼容所有iPhone.iPad.黑莓6+,以及桌面浏览器.底层实现基于HTML/CSS/JavaScript,是一款免费开源的相册产品 ...
- IOS下拉放大图片
代码地址如下:http://www.demodashi.com/demo/11623.html 一.实现效果图 现在越来越多的APP中存在下拉放大图片的效果,今天贡献一下我的实现这种方法的原理,和我遇 ...
- 我利用网上代码开发的JQuery图片插件
我利用网上代码开发的JQuery图片插件 代码如下 (function($){ $.fn.FocusPic = function(options){ var defaults = { interval ...
- 移动端全屏滑动的小插件，简单，轻便，好用，只有3k swiper,myswiper,page,stage
https://github.com/donglegend/mySwiper mySwiper 移动端全屏滑动的小插件,简单,轻便,好用,只有3k 下载 直接下载 bower install mySw ...
随机推荐
- 51nod 1463 找朋友（线段树+离线处理）
http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1463 题意: 思路: 好题! 先对所有查询进行离线处理,按照右区间排序, ...
- HDU 6073 Matching In Multiplication（拓扑排序+思维）
http://acm.hdu.edu.cn/showproblem.php?pid=6073 题意:有个二分图,左边和右边的顶点数相同,左边的顶点每个顶点度数为2.现在有个屌丝理解错了最佳完美匹配,它 ...
- UVa 10340 子序列
https://vjudge.net/problem/UVA-10340 题意: 输入两个字符串s和t,判断是否可以从t中删除0个或多个字符得到字符串s. 思路: 很水的题... #include&l ...
- SRM 596 DIV2
250pt: 直接枚举跳过的位置求和即可. int n,m; int ABS(int a) { ) return (-a); else return a; } class FoxAndSightsee ...
- Qt加载OSg视图例子
//QT += core gui opengl //LIBS += -losgViewer -losgDB -losgUtil -losg -lOpenThreads -losgGA -losgQt ...
- 如何学习编程和做好DBA
关于学习编程和做好DBA的关系 我这里只是讨论SQLSERVER DBA 我发现很多DBA都是从程序员开始做起的,一般做了4.5年之后就转型做DBA或者管理或者销售啊. 为什麽一开始不直接做DBA,D ...
- 《剑指offer》第三十四题（二叉树中和为某一值的路径）
// 面试题34:二叉树中和为某一值的路径 // 题目:输入一棵二叉树和一个整数,打印出二叉树中结点值的和为输入整数的所 // 有路径.从树的根结点开始往下一直到叶结点所经过的结点形成一条路径. #i ...
- Android蓝牙通信功能开发
1. 概述 Bluetooth 是几乎现在每部手机标准配备的功能,多用于耳机 mic 等设备与手机的连接,除此之外,还可以多部手机之间建立 bluetooth 通信,本文就通过 SDK 中带的一个聊天 ...
- docker相关杂项
代理 在vscode里build image习惯了,但是今天 从docker hub上pull python镜像,最后一个层,始终是waiting状态,pull不下来 好像不能临时.只能设置 http ...
- URAL 1501 Sense of Beauty
URAL 1501 思路: dp+记忆化搜索 状态:dp[i][j]表示选取第一堆前i个和第二堆前j的状态:0:0多1个 1:0和1相等 2:1 ...