这是之前制作的创建固定大小的缩略图的JS脚本的jQuery插件版本,依然具有图片预载功能,且脱离了css文件,不需要手动创建容器。

使用方法

1、调用jQuery类库和插件(如果已经调用了jQuery,可以省略第一行)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="js/jquery.QQWorld_PhotoCutter-min.js"></script>

2、在需要缩略的图片上加上特定标记

<img rel="cut_me" src="photo.jpg" />
<a href="#"><img rel="cut_me" src="photo.jpg" /></a>

3、激活插件的方法(将图片缩略为宽度150x120,并将图片外的容器class设置为myPhoto):

$("img[rel='cut_me']").QQWorldPhotoCutter({
width: 150,
height: 120,
class_name: 'myPhoto'
});

更新历史

  1. v1.0.3 - 2012.3.15 - 因为ie7下不能将json类的名字设置为class,将class改为class_name
  2. v1.0.2 - 2012.3.2 - 修复判断图片缓存预载之前就运行缩略功能,导致无法获取图片的width的问题
  3. v1.0.1 - 2011.10.19 - 添加可以设置外部容器class的功能
  4. v1.0.0 - 2011.10.18

[demo demo='#' download='https://www.qqworld.org/demo/jQuery/qqworld-photocutter/jquery.QQWorld_PhotoCutter.lastest.zip']

喜欢这篇文章吗,不妨分享给朋友们吧!