2015-08-18 4 views
2

На моей странице, я добавил таблицу и превращал все в ссылки, используя следующий код:Как связать lightbox2 в таблице?

HTML- <tr data-href="../images/accept.png" > <td> Blah Blah </td> </tr>

JQUERY-

$(document).ready(function(){ 
    $('table tr').click(function(){ 
     window.location = $(this).data('href'); 
     return false; 
    }); 
}); 

Я хочу использовать осветитель на каждом из эти ссылки, так что всякий раз, когда я нажимаю на любую строку, открывается лайтбокс. Я использую lightbox2 и не могу найти способ сделать это. Это страница для Lightbox2: http://lokeshdhakar.com/projects/lightbox2/

+0

Lightbox2 требует 'data-lightbox =" something "'. Вы пытались добавить это к вашему tr: ' Blah Blah' – Macsupport

+0

Я попробовал. Это не работает. Лайтбокс специально ищет теги, и я использую тег . –

ответ

0

Посмотрел на странице Lightbox2, и он хочет, чтобы вы использовать <a> тег, так что я бы рекомендовал делать это. Я не очень хорошо знаю этот инструмент, но он, вероятно, выглядит специально для тегов <a>, поэтому попытка имитировать эту функциональность не поможет.

Вы можете попробовать переделку макета таблицы, обернув содержание целой строки в <a> теге:

<tr> 
    <td> 
    <a href='#' data-lightbox='test'> 
     <div class='col1'>Col1</div> 
     <div class='col2'>Col2</div> 
    </a> 
    </td> 
</tr> 

Это потребовало бы вас сделать «клетку» форматирование с укладкой на вашем DIV с, но вы можете заставить его работать. Если вы не состоите в браке с макетом стола, у вас есть варианты. (Кроме того, таблицы в таблицах, в то время как боль в заднице, могут делать то, что вы хотите ...)

По моему опыту не сражайтесь с API/инструментом, с которым вы пытаетесь работать. Если вы хотите использовать его, выясните способ его использования, а не взломать его. Взлом это может быть забавно, но в конечном итоге приведет к головной боли (особенно в производственном коде !!!).

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