JScript

Programação & Desenvolvimento


Você não está conectado. Conecte-se ou registre-se

Use url de um campo de perfil para usar como pano de fundo.

2 participantes

Ir para baixo  Mensagem [Página 1 de 1]

Redline

Redline
Membro
Membro



  • Descrição:[/li]

Oi tudo, eu estive ocupado trabalhando em meu fórum e chegou a um ponto que eu fui preso. Peço desculpas se você não entende o que eu escrevo, porque eu traduzi com o google.

Use url de um campo de perfil para usar como pano de fundo. NxKnFi1
Imagem de referência (meu forum)
________________________

Bem, eu explico. Eu fiz um campo de perfil, nesse campo, eu coloquei isso:
Código:
[table class="portadage"]{tr}[td]http://i.imgur.com/9EhAHXy.png[/td][/tr][/table]

E eu coloquei esse código jQuery:
Código:
var urlportada = $(this).find(".portadage a").attr("href");
$(".postbody").find('.user').css('background-image', 'url( '+ urlportada + ')');
});

Explicando que faz isso, estou usando o perfil horizontal, o campo perfil contém uma url, que url, torna-se um "background-image". Bem, está tudo bem, o problema vem aqui: Todos ".postbody .user "  têm o mesmo fundo, o que eu faço é que cada usuário tem seu próprio fundo usando a url que está no campo de perfil.

Eu queria que você me ajudar com isso, eu tentei descobrir e adivinhar  :c




  • Fórum: zonastaff.bestforo.com/forum[/li]

  • Versão: PUNBB[/li]

  • Tipo: Pedido de código[/li]

  • Tags: Perfil, fundo, jQuery[/li]


waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Olá amigo.. Infelizmente não notei no seu fórum onde você está usando este efeito.. Poderia me enviar um tópico onde eu possa visualizar ele?
(Qual o seu idioma nativo? Inglês?)

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Minha língua é o espanhol, que você pode ver neste tópico: http://graphicevolution.foroactivo.com/t1459-vacaciones-del-foro

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Bom, deixa eu ver se eu entendi bem.. Você criou um campo personalizado para que os usuários do seu fórum preencham ele com uma URL de alguma imagem qualquer, então você quer que em cada postagem desses usuários seja mostrado essa imagem correto? Como se fosse uma capa do Facebook, mas no caso em cada seria meio que uma capa para a postagem do membro.. É isso?

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Sim, é Wagner Very Happy
Cada membro com sua própria imagem.

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Olá amigo, fiz um código aqui, veja se lhe ajuda em algo..

Primeiro, criei um campo personalizado no perfil do usuário, configurado da seguinte maneira
Use url de um campo de perfil para usar como pano de fundo. Sem_ta13

Ele é o primeiro na hierarquia dos campos personalizados (isso é importante, pois selecionei a url da imagem baseado nisso..)

E então adicionei o seguinte script
Código:
// <![CDATA[
$(function(){
    $("div.user-info").each(function() {
         jLink = $(this).children().next('img').attr('src');
         $(this).parent('div.user').css('background-image','url("'+jLink+'")');
         $(this).children().next('img').hide();
    });
});
// ]]>

O que ele faz é buscar a URL da segunda imagem de cada post e usar ela como background da div.user, é só um rascunho para você ver como é feito.. Veja se o código é útil para você

Veja o efeito em funcionamento aqui:
http://punbbteste.forumeiros.com/t3-pepeka-eu-love-voce

É só um fórum de testes, não ligue para as zueiras lá xD

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Wagner muito obrigado! Eu entendo como tem feito: D
Eu realmente aprecio isso

Edito:
Dejo visualização tem sido muito bom.
Use url de um campo de perfil para usar como pano de fundo. TsYp085

Apenas o que apaga a imagem de "Sexo"
Você poderia me ajudar com isso?

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Olá, você tem como tirar o fórum de manutenção para que eu possa verificar o que houve? E você deixou o campo que o usuário deve preencher em primeiro lugar na hierarquia? Assim:

https://www.dropbox.com/s/iq4691vpp3xp8rc/Captura%20de%20tela%202014-04-06%2015.40.08.png

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Sim Wagner, ficou bem D:
Eu tenho o fórum, porque o design fórum é uma surpresa para os membros. Você está agora acessível.

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Olá amigo, infelizmente vários elementos do seu fórum não estão visíveis a visitantes, então não tenho como efetuar os testes lá.. Mas enfim, tente usar este código aqui:
Código:
// <![CDATA[
$(function(){
    $("div.user-info").each(function() {
        var jLink = $(this).children('.label').next('img').attr('src');
            $(this).parent('div.user').css('background-image','url(" ' + jLink + ' ")');
            $(this).children('.label').next('img').hide();
    });
});
// ]]>

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Desculpe, eu pensei que eu já tinha testado e, portanto, fechou o fórum está agora aberto novamente.
Voltando ao assunto, o código tem o mesmo efeito que o anterior, mas a imagem do tipo de sexo está escondido.

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Mas não é só isso amigo, acesse seu painel e verifique o seguinte:
https://www.dropbox.com/s/qng1r6g1kyihzrz/Captura%20de%20tela%202014-04-06%2018.30.44.png

Provavelmente só membros podem ver porque quando acessei o fórum da outra vez não havia nenhuma imagem ali.. Você poderia tirar o código que eu te passei agora e colocar o antigo em funcionamento para eu fazer mais testes?

http://wagneraugusto.com.br/

Redline

Redline
Membro
Membro

Ei amigo, que é amigo, mmm sexo em espanhol "Género" é escrito.
É feito o que você disse.

Saudações Smile

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Realmente não estou conseguindo testar os códigos direto no seu fórum.. Mas, faça o teste com este código aqui para ver se resulta..
Código:
// <![CDATA[
$(function(){
    $("div.user-info").each(function() {

        var jLink = $(this).children().first('img').attr('src');

            $(this).parent('div.user').css('background-image','url(" ' + jLink + ' ")');

            $(this).children().first('img').hide();
    });
});
// ]]>

http://wagneraugusto.com.br/

Conteúdo patrocinado



Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos