Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] Indywidualny tooltip
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
marcin86s
tips
  1. $(function($) {
  2. $.fn.tips = function() {
  3.  
  4. var width = $(this).width();
  5. var height = $(this).height();
  6. var get_tip = $(this).attr('title');
  7. var get_pos = $(this).position();
  8.  
  9. $(this).removeAttr('title');
  10.  
  11. $(this).mouseenter(function() {
  12. $(this).append('<div class="tip"><p>' + get_tip + '</p></div>');
  13. $('.tip').css({
  14. 'left' : get_pos.left - 10,
  15. 'top' : get_pos.top + 16,
  16. 'min-width' : width + 20,
  17. });
  18. $(this).mouseleave(function(){
  19. $('.tip').fadeOut(0);
  20. });
  21. });
  22. return $(this);
  23.  
  24. }
  25. })(jQuery);

index:
  1. $(document).ready(function() {
  2. $('.wyswietl_podpowiedz').tips();
  3. });
  4. </script>

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
  1. $(document).ready(function() {
  2. $('p.wyswietl_podpowiedz').tips();
  3. })
[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.
  1. <a href="" class="wyswietl_podpowiedz" title="podpowiedz pierwsza">link pierwszy</a>
  2. <a href="" class="wyswietl_podpowiedz" title="podpowiedz druga">link drugi</a>

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ć. 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/
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. biggrin.gif
!*!
Bo to funkcja?
marcin86s
Z oficjalnej dokumentacji:
  1. (function( $ ) {
  2. $.fn.myPlugin = function() {
  3.  
  4. // Do your awesome plugin stuff here
  5.  
  6. };
  7. })( jQuery );

http://docs.jquery.com/Plugins/Authoring
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.