Dúvida sobre código javascript

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Dúvida sobre código javascript

Mensagem por Connor R. em 04/06/14, 01:35 am

  • Descrição:
Antes de tudo vejam a imagem abaixo:





Utilizo o seguinte código javascript para pegar a informação do perfil do membro e aplicar a imagem escolhida pelo membro para o perfil:

Código:

$(function() {
if($('#main-content').length) {
 var bg = $('#field_id16 dd').text();
if(bg) {
  $("capa-perfil").addClass('bodyPers').attr('style','background-image: url('+bg+');');
}
}
else {
  $.get('/profile?mode=editprofile', function(b) {
  var bg = $('#profile_field_13_16', b).val();
if(bg) {
    $("capa-perfil").addClass('bodyPers').attr('style','background-image: url('+bg+');');
}
  });
}
});

Mais não está funcionando, gostaria de saber se fiz algo errado..


  • Informações:
Fórum:http://somosmugiwara.forumeiros.com/Versão:PUNBB
Tipo:Pedido de códigoTags:Dúvida,sobre,código,javascript



Última edição por Connor R. em 05/06/14, 09:51 am, editado 1 vez(es)
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Resolvido Re: Dúvida sobre código javascript

Mensagem por waghcwb em 05/06/14, 08:00 am

Olá,

Antes de qualquer coisa... Me explique uma coisa, qual o objetivo deste código? O membro escolher qual imagem ele deseja de fundo para o perfil dele?

Esse fundo é mostrado só no perfil dele, ou em todas as páginas?
avatar

waghcwb
Usuário destaque

Masculino
Inscrito dia : 06/09/2012
Mensagens : 734
Pontos Ativos : 1097

Ver perfil do usuário http://punbb.forumeiros.com

Resolvido Re: Dúvida sobre código javascript

Mensagem por Connor R. em 05/06/14, 08:55 am

Sim sim
veja abaixo?

http://somosmugiwara.forumeiros.com/u1

seria um logo para o perfil adicionei no templante do perfil o código abaixo:

Código:

<div class="sombra"></div>
<div id="capa-perfil"></div>

e o CSS:
Código:

.sombra {
height: 430px;
position: absolute;
width: 1130px;
z-index: 99;
background: -webkit-linear-gradient(transparent 0%,rgba(0, 0, 0, 0.1) 30%,rgba(0, 0, 0, 0.3) 50%,rgba(0, 0, 0, 0.4) 100%);
background: -moz-linear-gradient(transparent 0%,rgba(0, 0, 0, 0.1) 30%,rgba(0, 0, 0, 0.3) 50%,rgba(0, 0, 0, 0.4) 100%);
}

#capa-perfil {
background: url(https://lh3.googleusercontent.com/-fVko08p5oKs/UTfIKAQ7I0I/AAAAAAABsoo/FyPvjpEE_5U/s9999-fcrop64=1,00002023fffff93a/Foto%2BZaira%2BMatheus015JPG.jpg);
height: 430px;
background-repeat: no-repeat;
background-position: center center;
border-radius: 10px 10px 0 0;
position: inherit;
width: 1130px;
z-index: 1;
box-shadow: 0 0 30px silver;
}

e o código javascript mostrado acima. este código seria para cada membro escolher o logo do seu perfil, ficando como na imagem:



este logo seria apenas mostrado nos perfis de cada membro..
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Resolvido Re: Dúvida sobre código javascript

Mensagem por waghcwb em 05/06/14, 08:59 am

Olá,

Certo, antes de continuarmos, não notei o efeito... Tem como colocar ele só para testes com alguma imagem padrão? Assim posso efetuar os testes e tentar fazer um código válido par ao senhor..

Uma última pergunta, quando um usuário acessar um perfil, a imagem que será mostrada é a que aparece no perfil daquele cara né? Porque notei que o código faz uma requisição Ajax sem necessidade se for isso...

Continuamos em seguida..
avatar

waghcwb
Usuário destaque

Masculino
Inscrito dia : 06/09/2012
Mensagens : 734
Pontos Ativos : 1097

Ver perfil do usuário http://punbb.forumeiros.com

Resolvido Re: Dúvida sobre código javascript

Mensagem por Connor R. em 05/06/14, 09:15 am

sim sim, cada perfil terá sua imagem de acordo com a qual o membro escolher...

já está ativado, mais não coloca a imagem que coloquei no logo...

veja:
http://i.imgur.com/daIlfXA.jpg
http://i.imgur.com/ZlDDel0.jpg
creio que precise ser cadastrado para ver o logo...

aqui tenho uma conta de testes

Login: Jack Striper
Senha: drapt007
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Resolvido Re: Dúvida sobre código javascript

Mensagem por waghcwb em 05/06/14, 09:25 am

Olá,

Faça o teste com este código...
Código:
/*
 // Profile cover
 // This code will add a background image to each profile on your forum
 // Author: Wagner ( /waghcwb )
 // Last update: 05/06/2014
 // © This work is free and you can modify or distribute it, but you need to keep this credits.
 */
//<![CDATA[
$(function(){
   
var p = $('#capa-perfil'),
    c = $('#field_id16 .row_data div').text();
if( p.length ) p.css('background', 'url('+c+')' );

});
//]]>

Verifica para mim se é isso que quer...
avatar

waghcwb
Usuário destaque

Masculino
Inscrito dia : 06/09/2012
Mensagens : 734
Pontos Ativos : 1097

Ver perfil do usuário http://punbb.forumeiros.com

Resolvido Re: Dúvida sobre código javascript

Mensagem por Connor R. em 05/06/14, 09:35 am

sim sim isso mesmo cara, ficou perfeito...

poderia me explicar o funcionamento do código?

to aprendendo javascript....
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Resolvido Re: Dúvida sobre código javascript

Mensagem por waghcwb em 05/06/14, 09:43 am

Com certeza que sim!!

Veja
Como fiz o código com jQuery e não Javascript puro, precisamos definir quando o código será executado, as opções mais comuns que você ja deve ter visto são a document ready e window load, optei por usar document ready, costumamos usar este código para declarar essa função:
Código:
$(document).ready(function(){
    //functions
});

Mas existe um shorthand para isso, que é este que usei:
Código:
$(function(){
    //functions
});

Logo em seguida, declaramos nossas variáveis para que possamos salvar os valores e também para que nosso código fique de fácil manutenção mais tarde.
Código:
var p = $('#capa-perfil'),
    c = $('#field_id16 .row_data div').text();

Variável p de profile para pegar a capa do perfil
E variável c de nem lembro porque coloquei ela kkk, mas para pegar o link da sua imagem. Ali usamos apenas seletores, coisa básica, acho que você consegue entender...

Logo após fazermos uma declaração if
Código:
if( p.length ) p.css('background', 'url('+c+')' );

Se (if) p (que equivale ao # capa-perfil) existir (.length) adicione ao próprio p uma regra CSS que é background url() com o valor que pegamos na variável c

Logo tudo que fazemos é pegar um valor de um canto do fórum para inserir em uma regra CSS na página... Bem simples...

Consegui elucidar bem o código? Ou ficou alguma dúvida?[/code]
avatar

waghcwb
Usuário destaque

Masculino
Inscrito dia : 06/09/2012
Mensagens : 734
Pontos Ativos : 1097

Ver perfil do usuário http://punbb.forumeiros.com

Resolvido Re: Dúvida sobre código javascript

Mensagem por Connor R. em 05/06/14, 09:51 am

Humrum entendii....
vou tentar estudar mais.. qualquer coisa falo contigoo.

Dúvida Resolvida..
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum