Sobre o tutorial visualizar em modo hover

[WebHacker]

Qual é minha questão:
Eu estava olhando a areá de tutorias e vi um tutorial

https://ajuda.forumeiros.com/t71749-tutorial-visualizar-informacoes-de-sub-foruns-em-modo-hover

E , ele não esta funcionando no meu forum , e , meu forum não e PHPBB3 , Aguardando

Endereço do meu fórum:
http://webhacker.forumbrasil.net

Versão do fórum:
PunBB

[Roevs]

Olá,

Creio que seja outro código javascript que esteja em conflito com ele tente retirar os códigos javascript e veja se resultou

Até

[WebHacker]

Meu forum não possui javascript ! apenas um que muda a tabela de cores da resposta rapida do forum.

[Roevs]

Olá,

Você adicionou os códigos JavaScript dos tutoriais né então retire esses outros dois e veja se resulta

Até

[WebHacker]

Eu removi , e não funcionou , uque fasso ?

[WebHacker]

up

[Sennior]

Olá!

Talvez amigão o senhor não está prestando á atenção no tutorial, peço que re-faça amigo!

Até mais!

[WebHacker]

Ala , Mike , está tudo no fórum já , Você podeira ir la nele e ver uque a de errado ? Eu coloquei tudo certinho os 3 codigos de js , coloquei o investimento no indice , e o css ja ta está la ! , Poderia me ajudar ?

[WebHacker]

Ops : Miike me desculpe pelo DOuble Post mais eu vi agora , O Modo hover ta funcionando mais quando eu passo a seta encima do Ultimo topico e não no do Titulo do Forum ! ;/ , Eu não sei pq so esta pegando la ;/

https://i.imgur.com/QfQGE.png <-- Olhe Aqui !

https://i.imgur.com/VzOJe.png <-- Olhe este tambem !

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[seender]

Olá!

Substitua todos os códigos por este.
Script 1:

Código:

(function(jQuery) {
 
    function fixTitle(jQueryele) {
        if (jQueryele.attr('title') || typeof(jQueryele.attr('original-title')) != 'string') {
            jQueryele.attr('original-title', jQueryele.attr('title') || '').removeAttr('title');
        }
    }
 
    function Tipsy(element, options) {
        this.jQueryelement = jQuery(element);
        this.options = options;
        this.enabled = true;
        fixTitle(this.jQueryelement);
    }
 
    Tipsy.prototype = {
        show: function() {
            var title = this.getTitle();
            if (title && this.enabled) {
                var jQuerytip = this.tip();
             
                jQuerytip.find('.tipsy-inner')[this.options.html ? 'html' : 'text'](title);
                jQuerytip[0].className = 'tipsy'; // reset classname in case of dynamic gravity
                jQuerytip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);
             
                var pos = jQuery.extend({}, this.jQueryelement.offset(), {
                    width: this.jQueryelement[0].offsetWidth,
                    height: this.jQueryelement[0].offsetHeight
                });
             
                var actualWidth = jQuerytip[0].offsetWidth, actualHeight = jQuerytip[0].offsetHeight;
                var gravity = (typeof this.options.gravity == 'function')
                                ? this.options.gravity.call(this.jQueryelement[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;
                    }
                }
             
                jQuerytip.css(tp).addClass('tipsy-' + gravity);
             
                if (this.options.fade) {
                    jQuerytip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity});
                } else {
                    jQuerytip.css({visibility: 'visible', opacity: this.options.opacity});
                }
            }
        },
     
        hide: function() {
            if (this.options.fade) {
                this.tip().stop().fadeOut(function() { jQuery(this).remove(); });
            } else {
                this.tip().remove();
            }
        },
     
        getTitle: function() {
            var title, jQuerye = this.jQueryelement, o = this.options;
            fixTitle(jQuerye);
            var title, o = this.options;
            if (typeof o.title == 'string') {
                title = jQuerye.attr(o.title == 'title' ? 'original-title' : o.title);
            } else if (typeof o.title == 'function') {
                title = o.title.call(jQuerye[0]);
            }
            title = ('' + title).replace(/(^s*|s*jQuery)/, "");
            return title || o.fallback;
        },
     
        tip: function() {
            if (!this.jQuerytip) {
                this.jQuerytip = jQuery('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>');
            }
            return this.jQuerytip;
        },
     
        validate: function() {
            if (!this.jQueryelement[0].parentNode) {
                this.hide();
                this.jQueryelement = null;
                this.options = null;
            }
        },
     
        enable: function() { this.enabled = true; },
        disable: function() { this.enabled = false; },
        toggleEnabled: function() { this.enabled = !this.enabled; }
    };
 
    jQuery.fn.tipsy = function(options) {
     
        if (options === true) {
            return this.data('tipsy');
        } else if (typeof options == 'string') {
            return this.data('tipsy')[options]();
        }
     
        options = jQuery.extend({}, jQuery.fn.tipsy.defaults, options);
     
        function get(ele) {
            var tipsy = jQuery.data(ele, 'tipsy');
            if (!tipsy) {
                tipsy = new Tipsy(ele, jQuery.fn.tipsy.elementOptions(ele, options));
                jQuery.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;
     
    };
 
    jQuery.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 jQuery.extend({}, options, {gravity: jQuery(ele).attr('tipsy-gravity') || 'n' });
    // (remember - do not modify 'options' in place!)
    jQuery.fn.tipsy.elementOptions = function(ele, options) {
        return jQuery.metadata ? jQuery.extend({}, options, jQuery(ele).metadata()) : options;
    };
 
    jQuery.fn.tipsy.autoNS = function() {
        return jQuery(this).offset().top > (jQuery(document).scrollTop() + jQuery(window).height() / 2) ? 's' : 'n';
    };
 
    jQuery.fn.tipsy.autoWE = function() {
        return jQuery(this).offset().left > (jQuery(document).scrollLeft() + jQuery(window).width() / 2) ? 'e' : 'w';
    };
 
})(jQuery);

Script 2:

Código:

(function(jQuery){function fixTitle(jQueryele){if(jQueryele.attr('title')||typeof(jQueryele.attr('original-title'))!='string'){jQueryele.attr('original-title',jQueryele.attr('title')||'').removeAttr('title')}}function Tipsy(element,options){this.jQueryelement=jQuery(element);this.options=options;this.enabled=true;fixTitle(this.jQueryelement)}Tipsy.prototype={show:function(){var title=this.getTitle();if(title&&this.enabled){var jQuerytip=this.tip();jQuerytip.find('.tipsy-inner')[this.options.html?'html':'text'](title);jQuerytip[0].className='tipsy';jQuerytip.remove().css({top:0,left:0,visibility:'hidden',display:'block'}).appendTo(document.body);var pos=jQuery.extend({},this.jQueryelement.offset(),{width:this.jQueryelement[0].offsetWidth,height:this.jQueryelement[0].offsetHeight});var actualWidth=jQuerytip[0].offsetWidth,actualHeight=jQuerytip[0].offsetHeight;var gravity=(typeof this.options.gravity=='function')?this.options.gravity.call(this.jQueryelement[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}}jQuerytip.css(tp).addClass('tipsy-' + gravity);if (this.options.fade) {jQuerytip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity})} else {jQuerytip.css({visibility: 'visible', opacity: this.options.opacity})}}},hide: function() {if (this.options.fade) {this.tip().stop().fadeOut(function() { jQuery(this).remove()})} else {this.tip().remove()}},getTitle: function() {var title, jQuerye = this.jQueryelement, o = this.options;fixTitle(jQuerye);var title, o = this.options;if (typeof o.title == 'string') {title = jQuerye.attr(o.title == 'title' ? 'original-title' : o.title)} else if (typeof o.title == 'function') {title = o.title.call(jQuerye[0])}title = ('' + title).replace(/(^\s*|\s*jQuery)/,"");return title||o.fallback},tip:function(){if(!this.jQuerytip){this.jQuerytip=jQuery('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>')}return this.jQuerytip},validate:function(){if(!this.jQueryelement[0].parentNode){this.hide();this.jQueryelement=null;this.options=null}},enable:function(){this.enabled=true},disable:function(){this.enabled=false},toggleEnabled:function(){this.enabled=!this.enabled}};jQuery.fn.tipsy=function(options){if(options===true){return this.data('tipsy')}else if(typeof options=='string'){return this.data('tipsy')[options]()}options=jQuery.extend({},jQuery.fn.tipsy.defaults,options);function get(ele){var tipsy=jQuery.data(ele,'tipsy');if(!tipsy){tipsy=new Tipsy(ele,jQuery.fn.tipsy.elementOptions(ele,options));jQuery.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};jQuery.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'};jQuery.fn.tipsy.elementOptions=function(ele,options){return jQuery.metadata?jQuery.extend({},options,jQuery(ele).metadata()):options};jQuery.fn.tipsy.autoNS=function(){return jQuery(this).offset().top>(jQuery(document).scrollTop()+jQuery(window).height()/2)?'s':'n'};jQuery.fn.tipsy.autoWE=function(){return jQuery(this).offset().left>(jQuery(document).scrollLeft()+jQuery(window).width()/2)?'e':'w'}})(jQuery);jQuery("document").ready(function(){jQuery(".forabg .row").mouseenter(function(){var mensajes=jQuery(this).find(".posts").text();var argumentos=jQuery(this).find(".topics").text();jQuery(this).find(".forumtitle").attr("title",mensajes+" & "+argumentos).tipsy({gravity:"w"})})});

Script 3:

Código:

jQuery(document).ready(function(){
  jQuery(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').tipsy({fade: true, gravity: 's'});
  });
});

Até mais!

[WebHacker]

Seender ainda não foi , Continua não aparecendo os status dos foruns , ;/

Mais muito obrigado ;D

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[WebHacker]

up

[Roevs]

Olá,

Eu consegui criar um código simples com edição de template veja o efeito dele



E quase igual caso deseja estarei ensinando como por caso queria do jeito do tutorial estarei tentando fazer o código do estilo do tutorial

Até

[WebHacker]

Tenta mudar o negocio de respostas e coloca mensagens e tenta por o hover com transparencia *-*

[Ace]

Olá,

Seu fórum é recente? Se não, no momento do lançamento do módulo, sua versão era outra? Fez a alteração de templates? Está colocando os códigos em páginas JS separadas?

Atenciosamente.

[WebHacker]

meu forum e recente , minha versao e punbb , ja fiz alteraçoes no template sim , os js estao separados como no tutorial pede

[WebHacker]

up!

[WebHacker]

up