是否可以在图像中添加一个显示在slimbox中的链接?

时间:2011-11-14 17:45:52

标签: javascript jquery image href slimbox

我有一个图片库,我正在使用slimbox。我想知道在图库中单击/悬停图像后是否可以在图像中添加链接,因为我能够在标题/标题中添加链接。

<a rel='slimbox' href="images/img2.jpg" title="&lt;a href=&quot;http://www.google.com&quot; &gt;Google&lt;/a&gt;">
   <img class="cloudcarousel" src="images/img1.jpg" width="128" height="164" alt=""  />
</a>   

1 个答案:

答案 0 :(得分:0)

是。您可以为每个图像添加标题/标题。但是您无法直接添加图像链接。尝试在Slimbox demo中添加标题中的链接。请检查来源。你可以有一些想法来定制。

<script type="text/javascript">//<![CDATA[
    window.addEvent("domready", function() {
        if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
            $$("a[href^=http://www.flickr.com/photos/] > img:first-child[src]").getParent().slimbox({
                loop: true,
                initialWidth: 1024,
                initialHeight: 768,
                overlayOpacity: 0.6,
                overlayFadeDuration: 200,
                resizeDuration: 1000,
                resizeTransition: Fx.Transitions.Elastic.easeOut,
                counterText: "This is image <strong>{x}</strong> on a total of <strong>{y}</strong> in this fabulous Flickr image gallery",
                previousKeys: [37, 80, 16],
                nextKeys: [39, 78, 17],
            }, function(el) {
                return [el.firstChild.src.replace(/_[mts]\.(\w+)$/, ".$1"),
                    (el.title || el.firstChild.alt) + '<br />Visit the <a href="' + el.href + '">Flickr page</a> for this picture.'];
            });
        }
        try {
            _gat._getTracker("UA-760577-1")._trackPageview();
        } catch(e) {}
    });
//]]></script>

<h2>Customization</h2>

    <p>You can change every parameter of Slimbox and make it work with any kind of link or element.<br />

    Below is an example of integration with Flickr links and custom options.</p>

    <p><a href="http://www.flickr.com/photos/14516334@N00/345009210/"><img src="http://farm1.static.flickr.com/159/345009210_1f826cd5a1_t.jpg" alt="A nice bee." /></a><a href="http://www.flickr.com/photos/alphageek/233472093/" title="Keyboard navigation is also customized here so you can use the Shift and Ctrl keys to navigate between images. Also, navigating to the next image will bring you back to the first one (loop option)."><img src="http://farm1.static.flickr.com/85/233472093_1f1d235e7b_t.jpg" alt="Flowers" /></a></p>