Автор Тема: Добавяне на закъснение 1сек при изпълнение на tooltip  (Прочетена 1530 пъти)

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Здравейте направих си tooltip но не знам как да добавя закъснение от 1 сек преди изпълнението му (тоест посочваме обекта и ако сме 1 или повече върху него се показва tooltip-а)
Ето го и кода:
Код
GeSHi (Javascript):
  1. $(document).ready(function() {
  2.  
  3. $(".tooltip,.buttonb,.button").hover(function(event) {
  4.  
  5. var rel = $(this).attr("rel");
  6.  
  7. $("<div id= 'tip' class='tool_left'><div class='tool_right'>"+rel +"</div></div>")
  8.  
  9. .css("position", "absolute")
  10.  
  11. .css("top", event.pageY + 10)
  12.  
  13. .css("left", event.pageX + 10)
  14.  
  15. .appendTo("body");
  16.  
  17. }, function() {
  18.  
  19. $("#tip").remove();
  20.  
  21. });
  22.  
  23.  
  24.  
  25. $(".tooltip").mousemove(function(event) {
  26.  
  27. $("#tip").css("top", event.pageY + 10).css("left", event.pageX +10);
  28.  
  29. });
  30.  
  31. });
Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/

VladSun

  • Moderator
  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Код
GeSHi (Javascript):
  1. $(document).ready(function()
  2. {
  3.  
  4. Function.prototype.deferOnce = function(scope, timeout, args)
  5. {
  6. var self = this;
  7. var fn = function () {self.apply(scope || window, args || [])};
  8.  
  9. if (this.timeoutID)
  10. clearTimeout(this.timeoutID);
  11.  
  12. this.timeoutID = setTimeout(fn, timeout);
  13. return this.timeoutID;
  14. }
  15.  
  16. Function.prototype.clearDeferOnce = function()
  17. {
  18. if (this.timeoutID)
  19. clearTimeout(this.timeoutID);
  20. this.timeoutID = null;
  21. }
  22.  
  23.  
  24. $("<div id= 'tip' class='tool_left'><div id='tip-inner' class='tool_right'></div></div>")
  25. .css("position", "absolute")
  26. .css("display", "none")
  27. .appendTo("body");
  28.  
  29.  
  30. var applyTooltip = function(event)
  31. {
  32. $("#tip-inner").html($(this).attr("rel"));
  33. $("#tip").css("display", "block");
  34. }
  35.  
  36. $(".tooltip").mousemove(function(event)
  37. {
  38. $("#tip").css("top", event.pageY + 10).css("left", event.pageX +10);
  39. });
  40.  
  41. $(".tooltip").hover
  42. (
  43. function(event)
  44. {
  45. applyTooltip.deferOnce(this, 1000, [event]);
  46. },
  47.  
  48. function()
  49. {
  50. applyTooltip.clearDeferOnce();
  51. $("#tip").css("display", "none");
  52. }
  53. );
  54.  
  55. });
  56.  

Има доста готови и добре написани tooltip plugin-и :)
Хвърли им едно око.
Активен

KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

NikolaiTalev

  • Напреднали
  • *****
  • Публикации: 307
  • Distribution: Debian Wheezy
  • Window Manager: KDE
    • Профил
    • WWW
Благодаря за помощта работи супер  :)
П.П Аз от готови гледах и така сглобих този, нещо не редно ли има ?
Че хич ме няма в JS-a все се каня да си купя някое четиво за JS-a поне да имам базови познания,защото за сега само от интернет съм чел. :)
Активен

Веднъж Linux, цял живот Linux.

http://blog.nk-support.eu/

VladSun

  • Moderator
  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Най-малкото е добре да подходиш jQuery-ски към проблема. Т.е. да създадеш jQuery plugin и след това да го ползваш по подобен начин:
Код
GeSHi (Javascript):
  1. $.tooltip.setDefaults(
  2. {
  3.    textAttr : 'rel',
  4.    css : 'myTooltipClass',
  5.    delay : 1000,
  6.    ...
  7. });
  8.  
  9. $(".tooltip").tooltip();
  10. $("#button").tooltip(
  11. {
  12.   textAttr: 'alt',
  13.   delay : 'none'
  14. });
  15. ...
« Последна редакция: Feb 21, 2011, 16:44 от VladSun »
Активен

KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

Подобни теми
Заглавие Започната от Отговора Прегледи Последна публикация
KDE2.2 i edin gaden zalepen tooltip
Настройка на програми
ivanatora 0 1444 Последна публикация Sep 02, 2003, 11:14
от ivanatora