推荐两款简单好用的图片放大jquery插件

一、zoomfiy.js

推荐可以从这里下载

使用说明:

使用该jquery 插件
引入该插件的js:zoomfiy.js 或 min
引入该插件的css:zoomfiy.css 或 min
前后顺序都可
js里加入 调用插件的函数 $(‘这里写要放大的图片‘).zoomify();
如果有ajax 新生成的图片,要在ajax里再次调用一遍该函数。

二、zoomooz.js

推荐这里下载

使用说明:

这个插件有很多种 放大功能,可进行优雅的缩放操作,特别适用相册网站。这个图片方法不是 单独图片跳脱出来的放大,而是点击该图片区域,这个区域的页面整体放大,有时候会导致放的的区域不准的情况。点击图片其他部分可以回到要放大的内容之前的状态,效果很炫酷。
必须引用一定有jquery和zoomooz.js
给要放大的元素加 class="zoomTarget"
即可实现简单的放大功能,
如果实现更加复杂的功能,
要在他的父级等标签上继续加 不同的class ,加一些js ,具体参见说明文档

以上两个插件是我试过众多插件中最好用最简单的,还有许多其他图片放大插件,有兴趣的朋友可以学习下。

比如:

swipebox

该插件好处:有具体的使用说明文档,貌似是要给点击的图片加一个a标签,在a标签上加相应的class。

zoom.js

该插件使用起来非常简单,直接给需要放大的图片加一个 data-action="zoom"即可,但是很多时候会报错:Cannot read property ‘end‘ of undefined 和 Cannot read property ‘0‘ of undefined

具体报错原因,目前还不明白,在本身项目结构复杂的时候应用最容易出现该错误,导致图片点击出现一点小小的Bug.

缺点:没有帮助文档,网上搜不到相关帖子

优点:适用于简单页面的图片放大,效果棒!

fancybox

该插件功能齐全,值得研究

点击这里有一些jquery插件推荐

时间: 2024-12-26 10:42:09

推荐两款简单好用的图片放大jquery插件的相关文章

推荐两款Windows下的开源调试器

在软件开发过程中,调试器可以说是一个得力助手,善用它你就可以快速定位bug并消灭之. 想想以前不会使用调试器功能的时候只靠输出数据来差错的方式,真是效率太低了. 如果你对调试器的运行原理好奇,学习开源软件是最好的途径.当然必备的入门书籍还是有必要的,如张银奎先生的<软件调试>一书就是本经典书籍. 言归正传,下面向大家推荐两款值得学习用的调试器.首先向大家推荐的是Nanomite,这是我在github上最早接触的一款开源调试器,支持x86/x64调试,可惜现在已经不更新了,但是基本功能都已经实现

插件介绍 :cropper是一款使用简单且功能强大的图片剪裁jQuery插件。

简要教程 cropper是一款使用简单且功能强大的图片剪裁jQuery插件.该图片剪裁插件支持图片放大缩小,支持鼠标滚轮操作,支持图片旋转,支持触摸屏设备,支持canvas,并且支持跨浏览器使用. cropper提供了大量的参数.方法和事件供图片的剪裁操作. 安装 可以通过Bower或NPM来安装该插件. 1 2 bower install cropper npm install cropper                使用方法 使用该图片剪裁插件首先要引入必要的js和css文件. 1 2

推荐两款远程管理Linux工具(基于Windows系统)

1.Xshell 百度百科:Xshell 是一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议.Xshell可以在Windows界面下用来访问远端不同系统下的服务器,从而比较好的达到远程控制终端的目的. 比如我们使用CentOS(社区企业操作系统)的时候,如果没有终端模拟软件,那么我们一般是通过 Open in Terminal 去打开终端. 但是如果我们有了xshell这款强大的工具后, 我们可以在xshell这款工具中去

另外一款超棒的响应式布局jQuery插件 – Freetile.js

在线演示 我们曾经介绍过俩款知名的响应式布局插:isotope和masonary,今天我们这里再介绍一款相当不错的响应式布局插件 – Freetile.js,使用它同样可以生成超酷的动态布局效果.相信大家一定会喜欢! 主要特性 Freetie来自于Assemblage和 Assemblage Plus的内建布局引擎,设计灵感来自于Masonry,VGrid和Wookmark,但是和他们相比较,拥有以下独特的地方: 允许包含任何尺寸的元素,并且不要求一个固定的列宽度,因此你不需要指定列宽度来迎合你

推荐两款PC健康小软件

一.前言 对于经常需要坐在电脑前工作一整天的人来说,健康问题是不得不关注的.下面推荐我一直在用的两款体积非常小(几百KB)的健康小软件,也许可以在无形中保护你.提醒你. 1. FadeTop 这是一款视觉休息定时提醒工具.工作或学习中的我们经常一坐就是好几个小时,渐渐的不仅眼睛受到很大的伤害,身体健康也深受影响,即传说中的“坐病”.而这款只有几百KB的小软件使用屏幕淡出的方式提醒我们用电脑时间久了该休息一会啦.我们可以手动设定休息的间隔时间(比如1个小时提醒一次),也可以设置淡出的具体效果(比如

jquery.lazyload 实现图片延迟加载jquery插件

看到了淘宝产品介绍中,图片是在下拉滚动条时加载,这是一个很不错的用户体验.减少了页面加载的时间了,也减轻了服务器的压力,就查了下用JQuery.. 什么是ImageLazyLoad技术 在页面上图片比较多的时候,打开一张页面必然引起与服务器大数 据量的交互.尤其是对于高清晰的图片,占的几M的空间.ImageLazyLoad技术就是,当前可见界面的图片是加载进来的,而不可见页面(通过滚动条 下拉可见)中的图片是不加载的,这样势必会引起速度上质的提升. 怎么实现ImageLazyLoad 一.使用J

Lazy Load, 延迟加载图片的 jQuery 插件 - NeoEase

body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI",Tahoma,Helvetica,Sans-Serif,"Microsoft YaHei", Georgia,Helvetica,Arial,sans-serif,宋体, PMingLiU,serif; font-size: 10.5pt; line-height: 1.5;

Lazy Load, 延迟加载图片的 jQuery 插件

本文翻译自 Lazy Load Plugin for jQuery, 介绍一个 jQuery 插件, 它提供懒汉式加载页面图片的功能. Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服

Lazy Load, 延迟加载图片的 jQuery 插件(转)

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. Lazy Load 灵感来自 Matt Mlinac 制作的 YUI ImageLoader 工具箱. 这是演示页面. 这里