文档章节

jquery-zoom图片放大处理

l
 luckxz999
发布于 2016/06/20 17:56
字数 129
阅读 61
收藏 0

第一步:引入相关文件

jQuery主文件:
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
zoom主文件
<script src="/jquery-zoom/content_zoom.js" type="text/javascript"></script>
<link rel="stylesheet" href="/jquery-zoom/common.css" type="text/css" />

第二步:HTML组织
<div id="largeDiv" style="display:none;"><img src="${largeImagePath}" /></div>
<a class="img" href="#largeDiv"><img style="height: 100px;width: 100px;" src="${thubmImagePath}"></a>

largeDiv为大图展示;<a class="img">展示缩略图。

注href="#largeDiv"必须只想所对应大图div的ID。

第三步:js初始化

$('a.img').fancyZoom({scaleImg: true, closeOnClick: true});

© 著作权归作者所有

共有 人打赏支持
l
粉丝 0
博文 5
码字总数 8084
作品 0
商丘
私信 提问
10 款免费的 jQuery 图像缩放插件

设计电子商务网站必知的十款免费 jQuery 图像缩放插件 Jquery 图像缩放插件不仅简单易用,而且还能够给予用户更好的体验。你只需要在图像或产品上移动鼠标,你将看到图片或产品的详细信息。 ...

oschina
2015/05/12
36.7K
9
20 个具有惊艳效果的 jQuery 图像缩放插件

jQuery相对与Flash的魔力已经贯穿整个网络。尽管,Flash层被认为是用于网页设计的首选,然而随着jQuery的出现,以及他的酷似Flash的交互式特效使得网页更加的优雅——Flash开始靠边站了。 相...

oschina
2014/02/04
37.5K
22
9款开发者值得一试的jQuery全新应用

jQuery是一个非常给力的JS框架,也因其使用方便而诞生了无数的jQuery应用插件,今天向大家分享9款全新的jQuery插件,前段开发者应该会比较喜欢。 1、jQuery图标选项卡上下滑动切换 这是一款非...

yykj
2013/10/28
808
5
推荐 6 款优秀的 jQuery/CSS3 应用插件

jQuery是一款非常轻巧优秀的JS类库,CSS3又可以十分方便地制作各种绚丽的网页效果,那么如果把jQuery的轻巧和CSS3的绚丽结合起来,相信一定会给网页添加不少精彩。下面搜集了几款非常出色的j...

yykj
2012/11/29
2.9K
9
Jquery两款原图放大插件收藏

1:Zoom Image Rollover 官方网站:http://bugsoftware.co.uk/jQuery/ZoomImgRollover/ demon code <script type="text/javascript" src="jquery-1.4.3.js"></script> <script type="text/jav......

zyyutian_1
2011/06/09
0
2

没有更多内容

加载失败,请刷新页面

加载更多

[Spring4.x]基于spring4.x纯注解的Web工程搭建

在前文中已经说明了如何基于 Spring4.x+ 版本开发纯注解的非web项目,链接如下: https://my.oschina.net/morpheusWB/blog/2985600 本文则主要说明,如何在Web项目中,"基于spring纯注解方式...

morpheusWB
26分钟前
4
0
基础编程题目集-7-13 日K蜡烛图

股票价格涨跌趋势,常用蜡烛图技术中的K线图来表示,分为按日的日K线、按周的周K线、按月的月K线等。以日K线为例,每天股票价格从开盘到收盘走完一天,对应一根蜡烛小图,要表示四个价格:开...

niithub
43分钟前
3
0
Jenkins window 下的安装使用

1.下载:https://jenkins.io/download/ 双击安装完毕,将自动打开浏览器: http://localhost:8080 打开对应位置的文件,将初始密钥粘贴至输入框。 第一个是 安装默认的软件;第二个是 自定义...

狼王黄师傅
45分钟前
2
0
深入解析react关于事件绑定this的四种方式

这篇文章主要介绍了详解react关于事件绑定this的四种方式,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可以参考学习下。如有不足之处,欢迎批评指正。 在react组件中,每个方...

前端攻城小牛
53分钟前
2
0
JS正则表达式

url的正则表达式:包括IP,域名(domain),ftp,二级域名,域名中的文件,域名加上端口!用户名等等信息 `function` `IsURL(str_url) {``var` `strRegex =``"^((https|http|ftp|rtsp|mm...

前端小攻略
57分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部