Informazione del gruppo, passando sul nome


In corso Informazione del gruppo, passando sul nome

Messaggio Da Primahs il Gio 9 Lug 2015 - 21:34

Ciaao!  ups

Ho notato che se passo col Mouse sui nomi degli utenti in un determinato gruppo mi compare una descrizione con colorazione..
Quindi vorrei chiedere:

Qual è il codice che si utilizza?  si^^

Ciao e grazie! :zen:
avatar
Primahs
****

Sesso : Maschile
Età : 18
Messaggi : 256
Località : Monza


http://creepypasta.forumattivo.it/forum
Primahs è stato ringraziato dall'autore di questo topic.

In corso Re: Informazione del gruppo, passando sul nome

Messaggio Da Niko il Gio 9 Lug 2015 - 23:43

ciao,

come giá discusso in un topic aperto da un altro membro (Alex2000 penso) non possiamo fornire questo codice per il momento, essendo riservato ai forum di supporto. Puoi però fare una ricerca su google (#tooltip) e vedere se trovi qualcosa Wink

se in futuro dovessimo rilasciare il codice, un tutorial sarà pubblicato :bene:

:zen:
avatar
Niko
Veterano dello staff
Veterano dello staff

Sesso : Maschile
Età : 21
Messaggi : 7761
Località : Provincia di Varese


https://www.translationscloud.com
Niko è stato ringraziato dall'autore di questo topic.

In corso Re: Informazione del gruppo, passando sul nome

Messaggio Da MattiaDes il Ven 10 Lug 2015 - 8:02

Ti faccio un regalo Embarassed come ha detto Niko è un tooltip.. cerca in rete per sapere meglio cos'è

Aggiungi questo codice nel CSS:

Codice:
/* Inizio Tooltip */

.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;
    border-radius: 5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    }

    .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;
    }

/* Fine ToolTip */

Aggiungi questo JS in tutte le pagine:

Codice:

(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'
        };
      
        $.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);

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

E' un codice trovato da qualche parte non ricordo dove happy

Praticamente ti mostra la descrizione di ciò che c'è nel title tramite tooltip.. in fondo al JS sono impostate le icone dei topic... ma puoi applicarlo su tutto (e volendo anche personalizzarlo tramite CSS)

Ora come ora da spiegare è un po' difficilotto, al massimo ci faccio un tutorial, che ne dici @Niko ?


avatar
MattiaDes
Amminattivo
Amminattivo

Sesso : Maschile
Età : 21
Messaggi : 3200
Località : Modena, Italy


http://www.habbolifeforum.com
MattiaDes è stato ringraziato dall'autore di questo topic.

In corso Re: Informazione del gruppo, passando sul nome

Messaggio Da Niko il Dom 19 Lug 2015 - 14:05

Ho già un tutorial pronto.. ci lavoreremo su :good:

..Caro utente,

ricordati che se il tuo problema ha ricevuto una risposta o può essere considerato risolto, è necessario premere sul bottone così da inserire l'icona risolto e facilitare il lavoro del personale.

Grazie per la tua collaborazione Wink
avatar
Niko
Veterano dello staff
Veterano dello staff

Sesso : Maschile
Età : 21
Messaggi : 7761
Località : Provincia di Varese


https://www.translationscloud.com
Niko è stato ringraziato dall'autore di questo topic.

In corso Re: Informazione del gruppo, passando sul nome

Messaggio Da MattiaDes il Sab 1 Ago 2015 - 17:45

..Caro utente,

questo problema è stato considerato abbandonato.

Purtroppo, secondo il nostro regolamento, se l'argomento non riceve risposta da più di 7 giorni, viene considerato risolto o abbandonato.
Nei prossimi topic di supporto che aprirai:
  • Se il problema non è risolto
    dovrai fare un messaggio di UP dopo 24 ore dal tuo ultimo messaggio cosi da riportare il problema agli occhi del personale
  • Se il problema è risolto
    è necessario premere sul bottone così da inserire l'icona risolto e facilitare il lavoro del personale


Ci vediamo su Forumattivo Wink


avatar
MattiaDes
Amminattivo
Amminattivo

Sesso : Maschile
Età : 21
Messaggi : 3200
Località : Modena, Italy


http://www.habbolifeforum.com
MattiaDes è stato ringraziato dall'autore di questo topic.

Vedere l'argomento precedente Vedere l'argomento seguente Tornare in alto

- Argomenti simili

 
Permessi di questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum