проблема / конфликт наложения инструментов jquery - PullRequest
Новая
       6

проблема / конфликт наложения инструментов jquery

1 голос
/ 29 ноября 2010

Я пытаюсь объединить наложение jQuery Tools с простым кодом, хотя наложение не сработает.

У меня есть пара контейнеров div, как показано ниже.Я перехожу к каждой функции и добавляю «right-margin: 0» и очищаю разрыв для каждого третьего элемента. 


<div class="essay-thumb">
 <a href="link.html"><img src="src.jpg" alt="Alt text" width="210" height="140" /></a>
 <h5>Header Text h5</h5>
</div>
<div class="essay-thumb">
 <a href="link2.html"><img src="src2.jpg" alt="Alt text 2" width="210" height="140" /></a>
 <h5>Header Text h5 2</h5>
</div>
...


$('.essay-thumb').each(function(i){
 if ( ((i+1)%3) == 0 ) {
  $(this).css('margin-right', 0).after('<br class="clear" />');
 }
})

Здесь я добавляю атрибут rel, захватывая содержимое атрибута alt вimg и добавьте его в связанный контейнер div в теге

...

, установите непрозрачность с помощью css на 0. 

$('#content .essay-thumb').each(function(i){
 $(this).find('a').attr('rel', '#modal'+(i+1) );
 var title = $(this).find('img').attr('alt');
 var link = $(this).find('a').attr('href');
 $('<span class="tooltip"><\/span>').appendTo($(this))
 $('<p><\/p>').text(title).appendTo($(this).find('.tooltip'));
})

Затем я анимирую непрозрачность до 0,8 при наведении и обратно0 


$('#content .essay-thumb').hover(function(e) {
  $(this).find('.tooltip').stop().animate({opacity: .8}, 500);
 }, function () { 
  $(this).find('.tooltip').stop().animate({opacity: 0}, 200);
 })

Наконец-то у меня есть строка для запуска наложения при нажатии.Это не работает, хотя, мне интересно, почему?Насколько я вижу, событие оверлея не привязано к связанному тегу.Любая помощь высоко ценится. 


$("#content .essay-thumb a[rel]").overlay({ expose: '#000', effect: 'apple' });
...