Coloca tooltip

Qual é minha questão:
Quero tooltip em tudo não no perfil quero nas categorias etc

Links e imagens do meu problema:
Não é necessário.

Endereço do meu fórum:
http://rvlforum.2areg.com

Versão do meu fórum:
PUNBB

Olá!

Poderia me dizer de qual tooltip o senhor se refere?

Abraços.

'Near escreveu:TIPO QUANDO PASSA NA CATEGORIAS APARECE UMA COISA REDONDA OU QUADRADRA COM ALGO

Olá!

Sim, mas, de qual tooltip o senhor se refere? Teria algum fórum para usar como base que eu possa ver?

Abraços.

'Near escreveu:Aqui imaguem

Olá!

Poderia me fornecer o link do fórum que viu tal efeito?

Abraços.

Olá!

Aceda ao seu:

Painel de Controle Módulos HTML & JAVASCRIPT Gestão dos Códigos JavaScript Criar um novo códigos Java Script

Investimento marque em todas as páginas, e o código, ponha este:

Código:

// tipsy, facebook style tooltips for jquery
// version 1.0.0a
// (c) 2008-2010 jason frame [jason@onehackoranother.com]
// releated under the MIT license

(function($) {
   
    function fixTitle($ele) {
        if ($ele.attr('title') || typeof($ele.attr('original-title')) != 'string') {
            $ele.attr('original-title', $ele.attr('title') || '').removeAttr('title');
        }
    }
   
    function Tipsy(element, options) {
        this.$element = $(element);
        this.options = options;
        this.enabled = true;
        fixTitle(this.$element);
    }
   
    Tipsy.prototype = {
        show: function() {
            var title = this.getTitle();
            if (title && this.enabled) {
                var $tip = this.tip();
               
                $tip.find('.tipsy-inner')[this.options.html ? 'html' : 'text'](title);
                $tip[0].className = 'tipsy'; // reset classname in case of dynamic gravity
                $tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);
               
                var pos = $.extend({}, this.$element.offset(), {
                    width: this.$element[0].offsetWidth,
                    height: this.$element[0].offsetHeight
                });
               
                var actualWidth = $tip[0].offsetWidth, actualHeight = $tip[0].offsetHeight;
                var gravity = (typeof this.options.gravity == 'function')
                                ? this.options.gravity.call(this.$element[0])
                                : this.options.gravity;
               
                var tp;
                switch (gravity.charAt(0)) {
                    case 'n':
                        tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                        break;
                    case 's':
                        tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                        break;
                    case 'e':
                        tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset};
                        break;
                    case 'w':
                        tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset};
                        break;
                }
               
                if (gravity.length == 2) {
                    if (gravity.charAt(1) == 'w') {
                        tp.left = pos.left + pos.width / 2 - 15;
                    } else {
                        tp.left = pos.left + pos.width / 2 - actualWidth + 15;
                    }
                }
               
                $tip.css(tp).addClass('tipsy-' + gravity);
               
                if (this.options.fade) {
                    $tip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity});
                } else {
                    $tip.css({visibility: 'visible', opacity: this.options.opacity});
                }
            }
        },
       
        hide: function() {
            if (this.options.fade) {
                this.tip().stop().fadeOut(function() { $(this).remove(); });
            } else {
                this.tip().remove();
            }
        },
       
        getTitle: function() {
            var title, $e = this.$element, o = this.options;
            fixTitle($e);
            var title, o = this.options;
            if (typeof o.title == 'string') {
                title = $e.attr(o.title == 'title' ? 'original-title' : o.title);
            } else if (typeof o.title == 'function') {
                title = o.title.call($e[0]);
            }
            title = ('' + title).replace(/(^\s*|\s*$)/, "");
            return title || o.fallback;
        },
       
        tip: function() {
            if (!this.$tip) {
                this.$tip = $('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>');
            }
            return this.$tip;
        },
       
        validate: function() {
            if (!this.$element[0].parentNode) {
                this.hide();
                this.$element = null;
                this.options = null;
            }
        },
       
        enable: function() { this.enabled = true; },
        disable: function() { this.enabled = false; },
        toggleEnabled: function() { this.enabled = !this.enabled; }
    };
   
    $.fn.tipsy = function(options) {
       
        if (options === true) {
            return this.data('tipsy');
        } else if (typeof options == 'string') {
            return this.data('tipsy')[options]();
        }
       
        options = $.extend({}, $.fn.tipsy.defaults, options);
       
        function get(ele) {
            var tipsy = $.data(ele, 'tipsy');
            if (!tipsy) {
                tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options));
                $.data(ele, 'tipsy', tipsy);
            }
            return tipsy;
        }
       
        function enter() {
            var tipsy = get(this);
            tipsy.hoverState = 'in';
            if (options.delayIn == 0) {
                tipsy.show();
            } else {
                setTimeout(function() { if (tipsy.hoverState == 'in') tipsy.show(); }, options.delayIn);
            }
        };
       
        function leave() {
            var tipsy = get(this);
            tipsy.hoverState = 'out';
            if (options.delayOut == 0) {
                tipsy.hide();
            } else {
                setTimeout(function() { if (tipsy.hoverState == 'out') tipsy.hide(); }, options.delayOut);
            }
        };
       
        if (!options.live) this.each(function() { get(this); });
       
        if (options.trigger != 'manual') {
            var binder  = options.live ? 'live' : 'bind',
                eventIn  = options.trigger == 'hover' ? 'mouseenter' : 'focus',
                eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
            this[binder](eventIn, enter)[binder](eventOut, leave);
        }
       
        return this;
       
    };
   
    $.fn.tipsy.defaults = {
        delayIn: 0,
        delayOut: 0,
        fade: false,
        fallback: '',
        gravity: 'n',
        html: false,
        live: false,
        offset: 0,
        opacity: 0.8,
        title: 'title',
        trigger: 'hover'
    };
   
    // Overwrite this method to provide options on a per-element basis.
    // For example, you could store the gravity in a 'tipsy-gravity' attribute:
    // return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' });
    // (remember - do not modify 'options' in place!)
    $.fn.tipsy.elementOptions = function(ele, options) {
        return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
    };
   
    $.fn.tipsy.autoNS = function() {
        return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n';
    };
   
    $.fn.tipsy.autoWE = function() {
        return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w';
    };
   
})(jQuery);

Feito isto, crie outro Java Script com as mesmas configurações mas com este código:

Código:

$(document).ready(function(){
  $(function() {
    $('a').tipsy({fade: true, gravity: 's'});
    $('.i_icon_quote').tipsy({fade: true, gravity: 's'});
    $('.i_icon_edit').tipsy({fade: true, gravity: 's'});
    $('.i_icon_delete').tipsy({fade: true, gravity: 's'});
    $('.i_icon_ip').tipsy({fade: true, gravity: 's'});
    $('.i_icon_profile').tipsy({fade: true, gravity: 's'});
    $('.i_icon_pm').tipsy({fade: true, gravity: 's'});
    $('.topic-title').tipsy({fade: true, gravity: 's'});
    $('.i_post').tipsy({fade: true, gravity: 's'});
    $('.i_reply').tipsy({fade: true, gravity: 's'});
  });
});

Valide! Agora aceda ao seu

Painel de Controle Visualização Imagens e Cores Cores Aba 'Folha de estilo CSS'

Cole este código e salve:

Código:

.tipsy {
padding: 5px;
font-size: 11px;
position: absolute;
text-shadow: none;
z-index: 999;
}

.tipsy-inner {
padding: 8px 8px 8px 8px;
background-color: black;
color: white;
max-width: 200px;
text-align: center;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4);
-moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);
background: black url(http://cuul.tk/img/gradient.png) repeat-x 0 -150px;
}

.tipsy-inner {
border-radius: 3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}

.tipsy-arrow {
position: absolute;
background: url('http://cuul.tk/img/tipsy.gif') no-repeat top left;
width: 9px;
height: 5px;
}

.tipsy-n .tipsy-arrow {
top: 0;
left: 50%;
margin-left: -4px;
}

.tipsy-nw .tipsy-arrow {
top: 0;
left: 10px;
}

.tipsy-ne .tipsy-arrow {
top: 0;
right: 10px;
}

.tipsy-s .tipsy-arrow {
bottom: 0;
left: 50%;
margin-left: -4px;
background-position: bottom left;
}

.tipsy-sw .tipsy-arrow {
bottom: 0;
left: 10px;
background-position: bottom left;
}

.tipsy-se .tipsy-arrow {
bottom: 0;
right: 10px;
background-position: bottom left;
}

.tipsy-e .tipsy-arrow {
top: 50%;
margin-top: -4px;
right: 0;
width: 5px;
height: 9px;
background-position: top right;
}

.tipsy-w .tipsy-arrow {
top: 50%;
margin-top: -4px;
left: 0;
width: 5px;
height: 9px;
}

Abraços.

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'

Olá!

Em investimento não marque todas as páginas, marque todas as caixas de cima, agora valide em ambos os códigos.

Abraços.

me ajuda ai

Olá!

Seu fórum está com muitos códigos Js, possa ser este a causa do problema, alguns podem estar interferindo nos outros, e pelo que eu vi no inspetor dois não estão funcionando como deveriam, no caso, tente retirar os códigos que não são tão relevantes para o senhor e veja o resultado.

Abraços.

Mais eu testei em outro forum que não funnfo

'Near escreveu:Mais eu testei em outro forum que não funnfo

Olá!

Qual a versão do fórum? O código que eu mandei foi para a versão PUNBB.

Abraços.

E Punbb

'Near escreveu:E Punbb

Olá!

Poderia me fornecer o link do tal fórum? E também, tenha certeza que a opção "Habilitar o gerenciamento dos códigos JavaScript :" está marcada com sim.

Abraços.

Eu ja tinha marcado faz tempo

'Near escreveu:Eu ja tinha marcado faz tempo

Olá!

Poderia me fornecer o link do fórum?

Abraços.

'Near escreveu:http://rvlforum.2areg.com

Olá!

É este fórum mesmo que está lotado de códigos Js e dois não funcionam corretamente, peço que retire alguns códigos e veja o resultado.

Abraços.

Mas eu testei os codigos em um forum de teste e não funfo

'Near escreveu:Mas eu testei os codigos em um forum de teste e não funfo

Olá!

Novamente, peço que me mandei o link do fórum de testes com o código ainda adicionado para que eu possa ver o erro.

Abraços.

Olá!

Peço que crie novamente outro Java Script mas com este código:

Código:

// tipsy, facebook style tooltips for jquery
// version 1.0.0a
// (c) 2008-2010 jason frame [jason@onehackoranother.com]
// releated under the MIT license

(function($) {
   
    function fixTitle($ele) {
        if ($ele.attr('title') || typeof($ele.attr('original-title')) != 'string') {
            $ele.attr('original-title', $ele.attr('title') || '').removeAttr('title');
        }
    }
   
    function Tipsy(element, options) {
        this.$element = $(element);
        this.options = options;
        this.enabled = true;
        fixTitle(this.$element);
    }
   
    Tipsy.prototype = {
        show: function() {
            var title = this.getTitle();
            if (title && this.enabled) {
                var $tip = this.tip();
               
                $tip.find('.tipsy-inner')[this.options.html ? 'html' : 'text'](title);
                $tip[0].className = 'tipsy'; // reset classname in case of dynamic gravity
                $tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);
               
                var pos = $.extend({}, this.$element.offset(), {
                    width: this.$element[0].offsetWidth,
                    height: this.$element[0].offsetHeight
                });
               
                var actualWidth = $tip[0].offsetWidth, actualHeight = $tip[0].offsetHeight;
                var gravity = (typeof this.options.gravity == 'function')
                                ? this.options.gravity.call(this.$element[0])
                                : this.options.gravity;
               
                var tp;
                switch (gravity.charAt(0)) {
                    case 'n':
                        tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                        break;
                    case 's':
                        tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                        break;
                    case 'e':
                        tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset};
                        break;
                    case 'w':
                        tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset};
                        break;
                }
               
                if (gravity.length == 2) {
                    if (gravity.charAt(1) == 'w') {
                        tp.left = pos.left + pos.width / 2 - 15;
                    } else {
                        tp.left = pos.left + pos.width / 2 - actualWidth + 15;
                    }
                }
               
                $tip.css(tp).addClass('tipsy-' + gravity);
               
                if (this.options.fade) {
                    $tip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity});
                } else {
                    $tip.css({visibility: 'visible', opacity: this.options.opacity});
                }
            }
        },
       
        hide: function() {
            if (this.options.fade) {
                this.tip().stop().fadeOut(function() { $(this).remove(); });
            } else {
                this.tip().remove();
            }
        },
       
        getTitle: function() {
            var title, $e = this.$element, o = this.options;
            fixTitle($e);
            var title, o = this.options;
            if (typeof o.title == 'string') {
                title = $e.attr(o.title == 'title' ? 'original-title' : o.title);
            } else if (typeof o.title == 'function') {
                title = o.title.call($e[0]);
            }
            title = ('' + title).replace(/(^\s*|\s*$)/, "");
            return title || o.fallback;
        },
       
        tip: function() {
            if (!this.$tip) {
                this.$tip = $('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>');
            }
            return this.$tip;
        },
       
        validate: function() {
            if (!this.$element[0].parentNode) {
                this.hide();
                this.$element = null;
                this.options = null;
            }
        },
       
        enable: function() { this.enabled = true; },
        disable: function() { this.enabled = false; },
        toggleEnabled: function() { this.enabled = !this.enabled; }
    };
   
    $.fn.tipsy = function(options) {
       
        if (options === true) {
            return this.data('tipsy');
        } else if (typeof options == 'string') {
            return this.data('tipsy')[options]();
        }
       
        options = $.extend({}, $.fn.tipsy.defaults, options);
       
        function get(ele) {
            var tipsy = $.data(ele, 'tipsy');
            if (!tipsy) {
                tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options));
                $.data(ele, 'tipsy', tipsy);
            }
            return tipsy;
        }
       
        function enter() {
            var tipsy = get(this);
            tipsy.hoverState = 'in';
            if (options.delayIn == 0) {
                tipsy.show();
            } else {
                setTimeout(function() { if (tipsy.hoverState == 'in') tipsy.show(); }, options.delayIn);
            }
        };
       
        function leave() {
            var tipsy = get(this);
            tipsy.hoverState = 'out';
            if (options.delayOut == 0) {
                tipsy.hide();
            } else {
                setTimeout(function() { if (tipsy.hoverState == 'out') tipsy.hide(); }, options.delayOut);
            }
        };
       
        if (!options.live) this.each(function() { get(this); });
       
        if (options.trigger != 'manual') {
            var binder  = options.live ? 'live' : 'bind',
                eventIn  = options.trigger == 'hover' ? 'mouseenter' : 'focus',
                eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
            this[binder](eventIn, enter)[binder](eventOut, leave);
        }
       
        return this;
       
    };
   
    $.fn.tipsy.defaults = {
        delayIn: 0,
        delayOut: 0,
        fade: false,
        fallback: '',
        gravity: 'n',
        html: false,
        live: false,
        offset: 0,
        opacity: 0.8,
        title: 'title',
        trigger: 'hover'
    };
   
    // Overwrite this method to provide options on a per-element basis.
    // For example, you could store the gravity in a 'tipsy-gravity' attribute:
    // return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' });
    // (remember - do not modify 'options' in place!)
    $.fn.tipsy.elementOptions = function(ele, options) {
        return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
    };
   
    $.fn.tipsy.autoNS = function() {
        return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n';
    };
   
    $.fn.tipsy.autoWE = function() {
        return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w';
    };
   
})(jQuery);

Em investimento marque todas as caixas de cima menos a caixa de "em todas as páginas".

Abraços.

Não funfo

Olá, substitua o segundo código por este:

Código:

$(document).ready(function(){
  $(function() {
    $('a').tipsy({fade: true, gravity: 's'});
    $('.i_icon_quote').tipsy({fade: true, gravity: 's'});
    $('.i_icon_edit').tipsy({fade: true, gravity: 's'});
    $('.i_icon_delete').tipsy({fade: true, gravity: 's'});
    $('.i_icon_ip').tipsy({fade: true, gravity: 's'});
    $('.i_icon_profile').tipsy({fade: true, gravity: 's'});
    $('.i_icon_pm').tipsy({fade: true, gravity: 's'});
    $('.topic-title').tipsy({fade: true, gravity: 's'});
    $('.i_post').tipsy({fade: true, gravity: 's'});
    $('.i_reply, img').tipsy({fade: true, gravity: 's'});
  });
});

Abraços.

não funfo vc poderia colocar
esperando 3 horas

up

Bom dia senhor Near'!

O senhor reclamou ao nosso Administrador Luciano98 que estavamos apagando suas mensagens, e eu tenho motivo. Seja educado, porque não temos somente o seu tópico para responder. Por favor, tenha calma!

Sobre sua questão, eu preciso que o senhor me envie o endereço que enviou ao Matheus por MP. Por favor, coloque neste tópico.

ALELUIA ALGUEM FALOU BRIGADO SENHOR 15-tronos.net

Bom dia Near...!!!

Nossa amigo, eu sofri heim! Eu imaginei que era edição de template, e quando eu ia desistir me caiu a ficha que o negócio era o JS que o Matheus passou. Me recordei que muitos JS com atributo $ não funcionam em Forumeiros, por isso eu modifiquei o JS para Jquery! Funcionou no meu fórum de teste.

Indo ao que interessa né, deixe todos os códigos citados pelo Matheus, e substitua esse:

Código:

$(document).ready(function(){
  $(function() {
    $('a').tipsy({fade: true, gravity: 's'});
    $('.i_icon_quote').tipsy({fade: true, gravity: 's'});
    $('.i_icon_edit').tipsy({fade: true, gravity: 's'});
    $('.i_icon_delete').tipsy({fade: true, gravity: 's'});
    $('.i_icon_ip').tipsy({fade: true, gravity: 's'});
    $('.i_icon_profile').tipsy({fade: true, gravity: 's'});
    $('.i_icon_pm').tipsy({fade: true, gravity: 's'});
    $('.topic-title').tipsy({fade: true, gravity: 's'});
    $('.i_post').tipsy({fade: true, gravity: 's'});
    $('.i_reply, img').tipsy({fade: true, gravity: 's'});
  });
});

Por esse:

Código:

jQuery(document).ready(function(){
    jQuery('a').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_quote').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_edit').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_delete').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_ip').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_profile').tipsy({fade: true, gravity: 's'});
    jQuery('.i_icon_pm').tipsy({fade: true, gravity: 's'});
    jQuery('.topic-title').tipsy({fade: true, gravity: 's'});
    jQuery('.i_post').tipsy({fade: true, gravity: 's'});
    jQuery('.i_reply, img').tipsy({fade: true, gravity: 's'});
  });

Veja se resulta, querido.

Atenciosamente,
Shek

funfo mais nas categorias não

Como assim? Poderia mostrar-me uma imagem?

Não tem como e so vc fica perto da categoria expemplo jogo ai não aparece aquela coisa um quadrado com Jogo

'Near escreveu:Não tem como e so vc fica perto da categoria expemplo jogo ai não aparece aquela coisa um quadrado com Jogo

Olá!

Não compreendi o que deseja, poderia especificar?

Abraços.

Shek escreveu:Como assim? Poderia mostrar-me uma imagem?

'Near escreveu:Não tem como e so vc fica perto da categoria expemplo jogo ai não aparece aquela coisa um quadrado com Jogo

Boa tarde!

O senhor pode mostrar uma imagem para acelerar o suporte, por gentileza?

Atenciosamente,

Aqui
http://i.imm.io/x8Q9.jpeg