Титла: Добавяне на закъснение 1сек при изпълнение на tooltip
Публикувано от: NikolaiTalev в Feb 21, 2011, 10:36
Здравейте направих си tooltip но не знам как да добавя закъснение от 1 сек преди изпълнението му (тоест посочваме обекта и ако сме 1 или повече върху него се показва tooltip-а) Ето го и кода: GeSHi (Javascript): $(document).ready(function() { $(".tooltip,.buttonb,.button").hover(function(event) { var rel = $(this).attr("rel"); $("<div id= 'tip' class='tool_left'><div class='tool_right'>"+rel +"</div></div>") .css("position", "absolute") .css("top", event.pageY + 10) .css("left", event.pageX + 10) .appendTo("body"); }, function() { $("#tip").remove(); }); $(".tooltip").mousemove(function(event) { $("#tip").css("top", event.pageY + 10).css("left", event.pageX +10); }); });
Титла: Re: Добавяне на закъснение 1сек при изпълнение на tooltip
Публикувано от: VladSun в Feb 21, 2011, 13:55
GeSHi (Javascript): $(document).ready(function() { Function.prototype.deferOnce = function(scope, timeout, args) { var self = this; var fn = function () {self.apply(scope || window, args || [])}; if (this.timeoutID) clearTimeout(this.timeoutID); this.timeoutID = setTimeout(fn, timeout); return this.timeoutID; } Function.prototype.clearDeferOnce = function() { if (this.timeoutID) clearTimeout(this.timeoutID); this.timeoutID = null; } $("<div id= 'tip' class='tool_left'><div id='tip-inner' class='tool_right'></div></div>") .css("position", "absolute") .css("display", "none") .appendTo("body"); var applyTooltip = function(event) { $("#tip-inner").html($(this).attr("rel")); $("#tip").css("display", "block"); } $(".tooltip").mousemove(function(event) { $("#tip").css("top", event.pageY + 10).css("left", event.pageX +10); }); $(".tooltip").hover ( function(event) { applyTooltip.deferOnce(this, 1000, [event]); }, function() { applyTooltip.clearDeferOnce(); $("#tip").css("display", "none"); } ); });
Има доста готови и добре написани tooltip plugin-и :) Хвърли им едно око.
Титла: Re: Добавяне на закъснение 1сек при изпълнение на tooltip
Публикувано от: NikolaiTalev в Feb 21, 2011, 14:10
Благодаря за помощта работи супер :) П.П Аз от готови гледах и така сглобих този, нещо не редно ли има ? Че хич ме няма в JS-a все се каня да си купя някое четиво за JS-a поне да имам базови познания,защото за сега само от интернет съм чел. :)
Титла: Re: Добавяне на закъснение 1сек при изпълнение на tooltip
Публикувано от: VladSun в Feb 21, 2011, 14:28
Най-малкото е добре да подходиш jQuery-ски към проблема. Т.е. да създадеш jQuery plugin и след това да го ползваш по подобен начин: GeSHi (Javascript): $.tooltip.setDefaults( { textAttr : 'rel', css : 'myTooltipClass', delay : 1000, ... }); $(".tooltip").tooltip(); $("#button").tooltip( { textAttr: 'alt', delay : 'none' }); ...
|