Powielanie okienek tooltipa, jQ Opcje

[rozny]

Cześć,

mam problem ze skryptem. Ogólnie działa jak chciałem, ale przy większej niż jedna ilości instancji zaczyna powielać mi diva z tooltipem. Jeżeli mam dwie instancje, to wyświetla dwa div'y z tym samym opisem, jak trzy instancje to trzy, itd.

Mój mózg tego sam nie ogarnia co ma "piernik do wiatraka".

kod tooltipa:

[PHP] pobierz, plaintext 
jQuery(document).ready(function($){
 
	$('a.inspiracje_anchor').hover(function() {
 
		var contid = $(this).prop('rel');
 
		var container = $('<div class="inspiracje_tip"></div>').fadeIn("2000");
		$('.insp-'+contid).append(container);
 
		$('.inspiracje_tip').append('<p class="inspiracje_tip_title">' + $(this).prop('name') + '</p>');
		$('.inspiracje_tip').append('<img class="thumb" src="' + $(this).prop('title') + '" />');
 
		$(this).prop({'title':''});
 
		var inspiracje_tip = new Object();
 
		inspiracje_tip.height = $('.inspiracje_tip').height();
 
		var position = $(this).position();
 
		position.top -= 75;
 
		inspiracje_tip.top = 0;
		inspiracje_tip.left = $('.inspiracje_tip').width()/2;
 
		if (inspiracje_tip.height > 15) {
			inspiracje_tip.top = $('.inspiracje_tip').height()/2;
		}
 
		$('.inspiracje_tip').css({'top':(position.top-inspiracje_tip.top) + 100 + 'px','left':(position.left-inspiracje_tip.left) - 230 + 'px'});
 
	}).mouseleave(function(){
 
		$img = $('.thumb').attr('src');
		$(this).prop({'title': $img});
 
		$('.thumb').remove();
		$('.inspiracje_tip_title').remove();
		$('.inspiracje_tip').remove();
 
	});
 
});
[PHP] pobierz, plaintext 

kod wyświetlający zdjęcie z kotwicami:

[HTML] pobierz, plaintext 
<div id="inspiracja1" class="inspiration_box">
	<h2 class="inspiration_title">Nazwa kolekcji</h2>
 
	<div id="inspiracje_picture_container" class="insp-1">
 
	<img src="adres_obrazka1.jpg">
<a id="1" class="inspiracje_anchor" name="Nazwa produktu" title="miniaturka.jpg" href="adres_produktu" style="left:pozycja_anchora_px; top: pozycja_anchorapx;" target="_new" rel="1">+</a>
</div>
</div>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div id="inspiracja2" class="inspiration_box">
	<h2 class="inspiration_title">Nazwa kolekcji</h2>
 
	<div id="inspiracje_picture_container" class="insp-2">
 
	<img src="adres_obrazka2.jpg">
<a id="1" class="inspiracje_anchor" name="Nazwa produktu" title="miniaturka.jpg" href="adres_produktu" style="left:pozycja_anchora_px; top: pozycja_anchorapx;" target="_new" rel="2">+</a>
<a id="2" class="inspiracje_anchor" name="Nazwa produktu" title="miniaturka.jpg" href="adres_produktu" style="left:pozycja_anchora_px; top: pozycja_anchorapx;" target="_new" rel="2">+</a>
</div>
</div>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div id="inspiracja3" class="inspiration_box">
	<h2 class="inspiration_title">Nazwa kolekcji</h2>
 
	<div id="inspiracje_picture_container" class="insp-3">
 
	<img src="adres_obrazka3.jpg">
<a id="1" class="inspiracje_anchor" name="Nazwa produktu" title="miniaturka.jpg" href="adres_produktu" style="left:pozycja_anchora_px; top: pozycja_anchorapx;" target="_new" rel="3">+</a>
<a id="2" class="inspiracje_anchor" name="Nazwa produktu" title="miniaturka.jpg" href="adres_produktu" style="left:pozycja_anchora_px; top: pozycja_anchorapx;" target="_new" rel="3">+</a>
</div>
</div>
[HTML] pobierz, plaintext 

i tak dalej... Tooltipy wyświetlają się oczywiście w tych kontenerach, w których leżą anchory, ale każdy z nich jest powielany tyle razy ile mam "galerii" na stronie. Dlaczego tak się dzieje?

Będę wdzięczny za nakierowanie mnie gdzie mam błąd w logice

strona http://eplytki.com -> możecie zobaczyć w czym problem.

Pozdrawiam

Poradziłem sobie,

wystarczyło dodać:

[PHP] pobierz, plaintext 
event.stopImmediatePropagation();
[PHP] pobierz, plaintext 

Można zamknąć.

Ten post edytował rozny 18.10.2017, 13:55:34