有短时间没放过关于WordPress有意思的东西出来啦。所以今天晚上就发个一直在折腾着的效果出来，因为刚刚补全，看着还可以。那就是–给图片加上一个放大镜，再搭配上图片幻灯效果，看着是不是高级了很多捏~~
这个最早应用在上一个主题中-twenty ten的那个修改版本（问题多已经停止下载）。记得那时候有个童鞋问我要代码，我没放，因为那时错误实在多，不好意思放，关键问题是背景有颜色设置的话，完全无效，这也是之前一段时间文章配图当鼠标滑过只有图片变浅没有放大镜的原因。还有前段时间稍微修改了一下，但是搞的图片位置错的厉害。所以今天晚上没啥心思做事，就把这个拿出来做了点改动。有兴趣可以滑过下面图片试试~~（偷懒用的前面的starcraft 2配图）
废话不说，我直接上代码。
1、jquery部分
主要部分代码（2010.12.21 更新）
$('.entry-content a:has(img)').each(function() {
//如果是带图片的链接，图片对应的id需要自己调整
if (jQuery(this).attr('href').match(/(jpg|gif|jpeg|png|tif)/)) $newclass = 'lightbox_image';
var $image = jQuery(this).contents("img");
if ($image.length > 0) {
if (jQuery.browser.msie && jQuery.browser.version < 7) jQuery(this).addClass('ie6_lightbox');
$image.wrap("");//把图片用span包起来
$image.parent().css({ //给这个span加css属性，当然也可以在css里直接写……
display: 'inline-block',
})
}
});
鼠标滑过图片变浅
$('.entry-content a img').hover(function() {
//图片对应的id需要自己调整
jQuery(this).stop().animate({
opacity: 0.5
},
400)
},
function() {
jQuery(this).stop().animate({
opacity: 1
},
400)
});
2、css部分
图片只需放在css对应的目录下
.lightbox_image {
background:url("images/zoom.png") no-repeat scroll center center transparent}
就这样，完鸟。请强制刷新看效果~~
题外
最后放一个曲子，几年前很喜欢，今天又听了一晚上，感觉依然安静奇妙。来自 怪物史莱克主题曲-Hallelujah
, All Rights Reserved.