首页
登录 | 注册

使用超酷的jQuery缩略图生成插件NailThumb制作漂亮的缩略图web应用

日期:2012-5-4  来源:GBin1.com

在线演示  本地下载

大家在网站开发和web应用中常常需要处理图片,因为用户上传的图片往往尺寸大小各不相同,如何能够生成统一尺寸的缩略图往往是让我们头疼的问题,常规的方 式基本都是使用后台程序PHP,JSP等处理上传后的图片,针对网站或者应用具体需要来切割指定大小的缩略图。主要问题在于你需要开发对应后台相关程序, 并且你一旦指定了缩略图大小后,以后如果希望能够随时修改的话,往往需要对后台代码进行修改,非常麻烦!今天我们将介绍一款超强的jQuery缩略图生成 插件 - NailThumb,使用这个插件可以帮助你在前台生成无图像扭曲的缩略图,而且支持前台裁剪,添加图片说明及其动画等功能,相信大家一定会喜欢!

主要特性
  • 自动处理图形分别率,不会生成扭曲的图片
  • 能够添加缩略图特效
  • 支持裁剪
  • 方便的添加图片说明
如何使用

导入jQuery类库,插件js和css,如下:




调用插件方法,如下:

$('.thumbwrapper').nailthumb({});

使用图片的容器元素即可生成缩略图。

图片缩略图展示应用

这里我们将开发一个图片缩略图展示应用,主要代码如下:

HTML

  • Hypermotard 796 SilverView Thumbnails

  • Hypermotard 796 RedView Thumbnails

  • Hypermotard 1100 Evo Red View Thumbnails










定义俩个容器元素,一个包含了需要生成缩略图的图片,另外一个元素包含了生成的不同大小的缩略图。

....

来源:使用超酷的jQuery缩略图生成插件NailThumb制作漂亮的缩略图web应用

相关文章

  • 为什么整个互联网行业都缺前端工程师?
    现在,几乎整个互联网行业都缺前端工程师,不仅在刚起步的创业公司,对上市公司乃至巨头这个问题也一样存在.没错,优秀的前端工程师简直比大熊猫还稀少. 每天,100offer的HR群都有人在吐槽招不到前端工程师.实话说对这些需求,Betty也无能 ...
  • Firefox 中使用 Java 插件
    重要:出于安全因素考虑, Firefox 已经阻止了 Java 插件自动运行.不过您仍然能在可信任的站点上使用 Java. 了解怎样解除阻止. 重要:新的 Windows 版 64 位 Firefox 不能识别和支持此插件.参见 这篇 Mo ...
  • Sublime Text插件的离线安装-使用htmlprettify美化您的HTML代码
    为此,我在网上搜索到了一个非常有用的Sublime Text插件,专门用于美化HTML代码,名叫htmlprettify. 到github这个repository里把HTMLPrettify的源代码下载到本地. 直接点击按钮"Cl ...
  • -vframes 操作选项 从视频中输出一帧生成文件:  ffmpeg -i input.flv -ss 00:00:14.435 -vframes 1 out.png 这个例子将会 seek 到时间进度条位置在 0h:0m:14sec:4 ...
  • FFmpeg使用手册 - ffmpeg对MP4的生成与处理-T
    可以分析MP4封装格式的工具比较多除了FFmpeg之外,还有一些常用工具,例如Elecard Stream Eye.MP4BOX.mp4info等:下面简单介绍一下这几款常见工 具: 8.1 Elecard Stream Eye 8.2 m ...
  • C# 生成、删除Word目录
    目录,是指书籍.文档正文前所载的目次,将主要内容以一定次第顺序编排,起指导阅读.检索内容的作用.在Word中创建目录前,需要设置文档相应文字或者段落的大纲级别,根据设定的大纲级别可创建文档的交互式大纲,即在Word文档左侧导航窗口中可显示为 ...

2020 unjeep.com webmaster#unjeep.com
12 q. 0.013 s.
京ICP备10005923号