jQuery Resize Plugin适用于< a> [英] jQuery Resize Plugin apply to <a>

问题描述

我在这里使用jQuery resize插件插件，它的工作原理应该如此在图像上。

I'm usign jQuery resize plugin Plugin here, it work's as it should on images.

但我正在尝试将它应用到图库 Galleriffic

But I'm trying to apply it to the gallery Galleriffic

问题是主图像包含在< a> 当我将一个类添加到< a> 标记时，调整大小不起作用。

The problem is that the main image is wraped in <a> and when I add a class to the <a> tag the resize don't work.

有什么建议吗？

这是我的加价：

<li>
<a class="thumb resize2" name="imagen1" href="images/400x400-1.jpg" title="imagen1">
<img class="resize1" src="images/400x400-1.jpg" alt="Title #0" />
</a>
</li>
<li>
<a class="thumb resize2" name="drop" href="http://farm3.static.flickr.com/2404/2538171134_2f77bc00d9.jpg" title="Title #1">
<img class="resize1" src="http://farm3.static.flickr.com/2404/2538171134_2f77bc00d9_s.jpg" alt="Title #1" />
</a>
<div class="caption">
Any html can be placed here ...
</div>
</li>

以下是剧本：

<script>
$(function() {
    $( ".resize1" ).aeImageResize({ height: 70, width: 70 });
    $( ".resize2" ).aeImageResize({ height: 10, width: 10 });
});
</script>

调整大小脚本是完美的，但我需要它在< a>

The resize script is perfect, but I need it to funcion on <a>

PD我在jQuery和脚本编写方面都很好。

P.D. I'm begginer in jQuery and scripting in general.

更新：
以下是它在浏览器中显示的截图：

UPDATE: Here is screenshot how it is shown in browser:

以下是来自galleriffic.js的一小部分file

Here is a fraction from galleriffic.js file

var newSlide = this.$imageContainer
                    .append('<span class="image-wrapper current"><a class="advance-link" rel="history" href="#'+this.data[nextIndex].hash+'" title="'+imageData.title+'">&nbsp;</a></span>')
                    .find('span.current').css('opacity', '0');

                newSlide.find('a')
                    .append(imageData.image)
                    .click(function(e) {
                        gallery.clickHandler(e, this);
                    });

它是广告推进链接类。

It ads advance-link class.

问题是：如何在高级类容器中向图像添加类？我希望我已经表达了自己的意思。

The question is: How can I add a class to the image in advance class container? I hope I've expressed myself correctly.

谢谢，

推荐答案

选择当前显示的图像可以像这样实现（在给定时间幻灯片中只有一个图像）：

Selecting the current displayed image can be achieved like this (there is only one image in the slideshow at a given time):

$("div#slideshow img")

但是为了更改图库主图像的大小，您还需要为以下元素设置宽度和高度：

But in order to change the gallery "main" image's size, you need to set the width and height also for the following elements:

$("div#slideshow a.advance-link")
// and also the parent element of $("div#slideshow") which I can't see in the screenshot you attached.

将调整大小功能添加到< a>构建图库的元素不会影响图库图像。

Adding "resize" functionality to the < a > elements the gallery is built from will not affect the gallery image.

这篇关于jQuery Resize Plugin适用于&lt; a&gt;的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！