Функция Colorbox как сделать изображение кликабельным

Question

Новое в jQuery, так что надеюсь кто-то может помочь с чем-то этим основным: я нашел эту замечательную функцию для Colorbox, предоставленной пользователем3571366, и отлично работает.

Однако, как вы делаете, что popup_image.jpg кликабельным (то есть. Пользователь нажимает на изображении, чтобы перейти к URL?)

Answer 1

Для одной статической ссылки вы можете использовать следующий код

$.colorbox({ 
    href:"", 
    open:true, 
    onComplete:function(){ 
     $('#cboxLoadedContent').click(function(){ 
      window.location.replace('http://www.google.com/'); 
     }) 
    } 
}); 

для динамических изображений, вы можете добавить значение data-url в ссылки anchor, чтобы onclick динамически перенаправлял эту ссылку.

HTML

<a class="group1" href="../content/ohoopee1.jpg" title="Me and my grandfather on the Ohoopee." data-url="http://stackoverflow.com/questions/26623556/colorbox-function-how-to-make-image-clickable">Stackoverflow</a> 

JS

$(".group1").colorbox({rel:'group1',onComplete:function(e){ 
    if($(e.el).data('url')) 
     $('#cboxLoadedContent').prop("onclick", null).unbind('click').click(function(){ 
       window.location.replace($(e.el).data('url')); 
     }) 
}}); 

UPDATE

Замените код на код ниже.

$.colorbox({ 
    href:"http://s3.argim.net/files/s/gatobailedw7_4ew.gif", 
    open:true, 
    onComplete:function(){ 
     $('#cboxLoadedContent').click(function(){ 
      window.location.replace('http://google.com'); 
     }) 
    } 
}); 

ПРИМЕЧАНИЕ: DONOT забудьте добавить http://