[jQuery] Indywidualny tooltip Opcje

[marcin86s]

tips

[HTML] pobierz, plaintext 
$(function($) {
	$.fn.tips = function() {
 
		var width = $(this).width();
		var height = $(this).height();
		var get_tip = $(this).attr('title');
		var get_pos = $(this).position();
 
		$(this).removeAttr('title');
 
		$(this).mouseenter(function() {
			$(this).append('<div class="tip"><p>' + get_tip + '</p></div>');
			$('.tip').css({
				'left' : get_pos.left - 10,
				'top' : get_pos.top + 16,
				'min-width' : width + 20,
			});
			$(this).mouseleave(function(){
				$('.tip').fadeOut(0);
			});
		});
		return $(this);
 
	}
})(jQuery);
[HTML] pobierz, plaintext 

index:

[HTML] pobierz, plaintext 
		<script>
		$(document).ready(function() {
			$('.wyswietl_podpowiedz').tips();
		});
		</script>
[HTML] pobierz, plaintext 

Gdy dwa elementy mają tą samą klase przypisaną do mojego tips'a po najechaniu na drugi skrypt działa przy pierwszym. Jak to rozwiązać nie robiąc nowej klasy css dla każdego elementu wymagającego podpowiedzi?

[skowron-line]

Możesz nadać na konkretny element o danej klasie.

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
    $('p.wyswietl_podpowiedz').tips();
})
[JAVASCRIPT] pobierz, plaintext 

[marcin86s]

Nie o to mi chodziło, problem polega na tym że mam ileś tam linków do których mają być podpowiedzi, ale jak najadę na inny niż pierwszy wyświetla się to nieprawidłowo.

[HTML] pobierz, plaintext 
<a href="" class="wyswietl_podpowiedz" title="podpowiedz pierwsza">link pierwszy</a>
<a href="" class="wyswietl_podpowiedz" title="podpowiedz druga">link drugi</a>
[HTML] pobierz, plaintext 

W skrócie, najeżdżając na link drugi, wyświetla mi się podpowiedz pierwsza, a nie chce robić osobnych klas dla każdej z podpowiedzi.

[skowron-line]

Wrzuć na http://jsfiddle.net/ i daj link będzie prościej.

[marcin86s]

Ten skrypt jakoś nie chce z tym działać. (IMG:style_emoticons/default/tongue.gif)

http://jsfiddle.net/FV5hc/3/

[Lysiur]

Poprawiłem nieco, nie wiem jakiego 'tips()' używałeś, ale być może to Cię naprowadzi na rozwiązanie,

http://jsfiddle.net/FV5hc/7/

Ten post edytował Lysiur 6.03.2013, 01:21:28

[marcin86s]

Dlaczego te jQuery dałeś przed całą funkcja a nie po jak jest w oficjalnej dokumentacji? Chciałbym wiedzieć co i jak a nie żeby tylko działało. (IMG:style_emoticons/default/biggrin.gif)

[!*!]

Bo to funkcja?

[marcin86s]

Z oficjalnej dokumentacji:

[HTML] pobierz, plaintext 
(function( $ ) {
  $.fn.myPlugin = function() {
 
    // Do your awesome plugin stuff here
 
  };
})( jQuery );
[HTML] pobierz, plaintext 

http://docs.jquery.com/Plugins/Authoring

[!*!]

http://docs.jquery.com/Core/jQuery.noConflict