2013-03-11 4 views
0

Привет всем кодам качества и другим!colorbox: Как включить ссылку в заголовок?

У меня есть простая галерея, используя ColorBox ...

$(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> 

Я бы так что пользователь может загрузить Hi-Res версию (в виде архива), например, каждую фотографию, чтобы включить ссылку в названии. Я попытался установить href в zip-файл, но все, что он сделал, - это переход на следующую фотографию. Я вижу по параметрам colorbox есть много вариантов, но я не знаю достаточно об этом, чтобы выяснить, какой из них - лучший способ.

Любая помощь будет оценена ... спасибо!

ответ

2

Глядя на раздел «Использование» в верхней части colorbox homepage есть пример, который использует функцию для заголовка:

// 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>'; 
}}); 

Я думаю, что это то, что вы ищете. В функции вы можете ссылаться на zip-файл, а не на то же изображение в окне _blank. Но это должно вас заставить.

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); 
}}); 

Очевидно, что вам нужно изменить ссылку аргумент, но вы не дали нам достаточно информации для примера ,

2

Я получил его работу, благодаря вашей помощи Клод и Ишервуд ... спасибо!

Вот Colorbox 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> 

YAY !!

+0

Спасибо, он тоже работал для меня. – Aaron

Смежные вопросы