0

品質およびその他のすべてのコーダーにこんにちは！

カラーボックスを使用したシンプルなギャラリーがあります...

    $(document).ready(function()
        {
        $(".gallery").colorbox({rel:'gallery', transition:"none", width:"95%", height:"95%"});
        })

    <a class="gallery" href="image.jpg" title="Click here to download hi-res version"><img src="imageThumbnail.jpg"></a>

ユーザーが高解像度バージョン (zip ファイル) をダウンロードできるように、各写真のタイトルにリンクを含めたいと思います。zipファイルにhrefをセットしてみましたが、次の写真に進むだけでした。カラーボックスのパラメーターを見ると、多くのオプションがあることがわかりますが、どれが最善の方法であるかを判断するには、これについて十分に知りません。

助けていただければ幸いです...ありがとう!!

4

3 に答える 3

2

クロードとイッシャーウッドの助けのおかげで、うまくいきました...ありがとう！

カラーボックスjqueryは次のとおりです。

$(document).ready(function(){
    $(".gallery").colorbox({rel:'gallery', transition:"none", width:"95%", height:"95%"});
});

$(document).ready(function(){
    $("a.gallery").colorbox({
        rel: 'a.gallery',
        title: function(){
            var url = $(this).attr('name');
            var txt = $(this).attr('title');
            return txt+'<br /><a href="'+url+'" target="_blank">download hi-res (.tif.zip)</a>';
        }
    });
});

そしてHTML：

<a href="Image.jpg" class="gallery" name="Image.zip" title="Image">
    <img src="thumbnail/Image.jpg">
</a>

わーい！！

于 2013-03-12T13:05:38.337 に答える
2

colorbox ホームページの上部にある「使用法」セクションを見ると、タイトルに関数を使用する例があります。

// ColorBox can accept a function in place of a static value:
$("a.gallery").colorbox({rel: 'gal', title: function(){
    var url = $(this).attr('href');
    return '<a href="' + url + '" target="_blank">Open In New Window</a>';
}});

これがあなたが探しているものだと思います。この関数では、_blank ウィンドウ内の同じ画像ではなく、zip ファイルを参照できます。しかし、これでうまくいくはずです。

于 2013-03-11T17:48:41.637 に答える
0

それはColorBoxのドキュメントにあります：タイトルをリンクにしてください

http://www.jacklmoore.com/colorbox/faq#faq-titlelink

$('a.gallery').colorbox({title:function () {
    return "To view full size, click here!".link(this.href);
}});

明らかに、リンク引数を変更する必要がありますが、例として十分な情報が提供されていません。

于 2013-03-11T17:50:36.563 に答える