[TUTORIAL] Avatar na resposta rápida

Neste tutorial, aplicaremos um código JavaScript para criar um efeito incrível, permitindo ao usuário a visualizar o avatar do membro ao lado da caixa de respostas rápidas.

--> Tutoriais, dicas e astúcias <--
Avatar na resposta rápida

1º - Código a ser utilizado:

Código:

/***
 * Application: Avatar in fast reply.
 * Description: This application shows the member avatar's in fast reply.
 * Version: 1.03212014-jq1.9.1 - Neterket, 3ª dynasty
 * Made and Optimizations by JScript - 2014/03/21
 * View more in: http://ajuda.forumeiros.com
 * Copyright (c) 2013 JScript <jscriptbrasil at live dot com>
 * This work is free. You can redistribute it and/or modify it
 * under the terms of the WTFPL, Version 2
 */
jQuery(function () {
    if (_userdata.session_logged_in) {
        var sHtml =
            '<a id="reply_avatar" class="jsUserPhotoLink left" title="Meu Perfil" href=""></a>';
        var sCSS =
            '<style>' +
            '.left {' +
                'float: left;' +
            '}' +
            '.jsUserPhotoLink {' +
                'margin: 9px;' +
                'position: absolute;' +
            '}' +
            '.jsUserPhoto {' +
                'background: none repeat scroll 0 0 #FFFFFF;' +
                'border: 1px solid #D5D5D5 !important;' +
                'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
                'padding: 1px;' +
            '}' +
            '.jsUserPhoto_medium {' +
                'max-height: 100px;' +
                'max-width: 100px;' +
            '}' +
            '.input_check, .input_radio, img {' +
                'vertical-align: middle;' +
            '}' +
            '</style>';
        jQuery(sCSS).insertBefore('body');
       
        jQuery('#quick_reply, #qpost .qreply').prepend(sHtml);
        jQuery('#reply_avatar')
            .attr('href', '/u' + _userdata.user_id)
            .prepend(_userdata.avatar);
        jQuery('#reply_avatar img').addClass('jsUserPhoto jsUserPhoto_medium');
        if (jQuery('.bodyline, #pun-intro').length) jQuery('#reply_avatar').css('position', 'relative');
    }
});

2º - Aplicando código JS:
As páginas javascript ativas em seu fórum possibilita inserir scripts e jquery para personalizar seu fórum, contudo é importante saber que qualquer script encontrado na internet acabam por não surgir efeito nos fóruns.

Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts >>

Título Correspondente ao nome da página JavaScript/jQuery que será criada.

Localização- São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. No nosso caso, aplicaremos Nos tópicos.

Código JavaScript Campo destinado para receber os códigos JavaScript e jQuery.

Habilitar o gerenciamento dos códigos JavaScript Ao selecionar a opção sim, estará ativando a função páginas Javascript no seu fórum. Se selecionar não, as páginas serão desabilitadas no fórum.

• Resultado:
  
  

---

© Fórum dos Fóruns & JScript

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Avatar na resposta rápida