Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Como passar para a direita um efeito de Halloween
Hoje à(s) 02:19 pm por Luiz

» [Sugestão] Grupo de Acesso ao Painel
Hoje à(s) 02:17 pm por Luiz

» Nova MP ModerNBB
Hoje à(s) 02:14 pm por Luiz

» Como abrir um Evento/Anuncio de um tópico?
Hoje à(s) 02:00 pm por Luiz

» Retirar código de confirmação
Hoje à(s) 02:00 pm por Luiz

» Questão sobre aspeto de blog
Hoje à(s) 02:00 pm por Luiz

» Como resolver ? Este nome de usuário já está sendo utilizado.
Hoje à(s) 01:59 pm por Luiz

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Luiz
 
Matt Shultz
 
iScroll
 
Harleen
 
Ketholy123
 
zHugh
 
T1ag0
 
PlayWillian
 
ranzatti
 
Lecxa
 

Quem está conectado
248 usuários online :: 8 usuários cadastrados, Nenhum Invisível e 240 Visitantes :: 2 Motores de busca

Adder_, DustyRhodes, iScroll, Ketholy123, Luiz, Shek, uvmyyvpew, xDominiC_.

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Fundo do fórum animado

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

Resolvido Fundo do fórum animado

Mensagem por Jhool em 25/08/17, 07:25 am

Detalhes da questão


Endereço do fórum: http://familiawarning.forumeiros.com/forum
Versão do fórum: PunBB

Descrição


Olá, o meu fórum não tem fundo algum e estava tentando achar alguns legais, até que eu encontrei este fórum e achei algo muito interessante, o fundo do fórum dele é em gif e quando coloca o mouse encima ele faz uma animação. Poderiam me passar um código parecido? ou ensinar colocar um fundo desta forma?

Fórum em que vi: http://brasilplayultimate.forumeiros.com/portal
avatar

Jhool
Nível 8

Masculino
Inscrito dia : 10/01/2017
Mensagens : 149
Pontos Ativos : 243

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

Resolvido Re: Fundo do fórum animado

Mensagem por Kyo Panda em 25/08/17, 09:31 am



Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5785

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

Resolvido Re: Fundo do fórum animado

Mensagem por Jhool em 25/08/17, 02:23 pm

Tentei de todas as formas e não consegui, segui certinho o que foi dito no tópico, criei o JS e tudo, mas não funcionou.

Tem como me ajudar?
avatar

Jhool
Nível 8

Masculino
Inscrito dia : 10/01/2017
Mensagens : 149
Pontos Ativos : 243

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

Resolvido Re: Fundo do fórum animado

Mensagem por Kyo Panda em 25/08/17, 02:32 pm

Utilize esse script com Investimento em Todas as páginas:

Código:
(function ($) {
   $(function () {

      $.getScript('https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.0/TweenMax.min.js').then(function() {
         $('body').prepend('<canvas id="background-canvas"></canvas>');

         !function(){function s(){e=window.innerWidth,i=window.innerHeight,r={},n=document.getElementById("background-canvas"),n.width=e,n.height=i,o=n.getContext("2d"),y()}function u(){"ontouchstart"in window||window.addEventListener("mousemove",h),window.addEventListener("resize",p)}function d(){v()}function v(){a&&w(),requestAnimationFrame(v)}function h(e){var i=posy=0;e.pageX||e.pageY?(i=e.pageX,posy=e.pageY):(e.clientX||e.clientY)&&(i=e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,posy=e.clientY+document.body.scrollTop+document.documentElement.scrollTop),r.x=i,r.y=posy}function p(){e=window.innerWidth,i=window.innerHeight,n.width=e,n.height=i;for(var o in t)TweenLite.killTweensOf(t[o]);y()}function y(){t=[];for(var n=0;e/c>=n;n++)for(var o=0;i/c>o;o++){var r=n*c,a=o*c,f={x:r,originX:r,y:a,originY:a};t.push(f)}for(var s=0;s<t.length;s++){for(var u=[],d=t[s],v=0;v<t.length;v++){var h=t[v];if(d!=h){for(var p=!1,y=0;5>y;y++)p||void 0==u[y]&&(u[y]=h,p=!0);for(var y=0;5>y;y++)p||x(d,h)<x(d,u[y])&&(u[y]=h,p=!0)}}d.closest=u}for(var s in t){var w=new b(t[s],l,"rgba(255,255,255,0.3)");t[s].circle=w}for(var s in t)g(t[s])}function w(){o.clearRect(0,0,e,i);for(var n in t)r&&(Math.abs(x(r,t[n]))<4e3?(t[n].opacity=.3,t[n].circle.opacity=1):Math.abs(x(r,t[n]))<2e4?(t[n].opacity=.1,t[n].circle.opacity=1):Math.abs(x(r,t[n]))<4e4?(t[n].opacity=.02,t[n].circle.opacity=.8):(t[n].opacity=0,t[n].circle.opacity=.7)),t[n].circle.color="rgba(0,146,255)",m(t[n]),t[n].circle.draw()}function g(e){TweenLite.to(e,1+1*Math.random(),{x:e.originX+Math.random()*(c/2),y:e.originY+Math.random()*(c/2),ease:Circ.easeInOut,onComplete:function(){g(e)}})}function m(e){if(r)for(var i in e.closest)o.beginPath(),o.moveTo(e.x,e.y),o.lineTo(e.closest[i].x,e.closest[i].y),o.strokeStyle="rgba(0,146,255,"+e.opacity+")",o.stroke()}function b(e,i,n){var t=this;!function(){t.pos=e||null,t.radius=i||null,t.color=n||null}(),this.draw=function(){o.beginPath(),o.arc(t.pos.x,t.pos.y,t.radius,0,2*Math.PI,!1),o.fillStyle="rgba(0,146,255,"+t.opacity+")",o.fill()}}function x(e,i){return Math.pow(e.x-i.x,2)+Math.pow(e.y-i.y,2)}var e,i,n,o,t,r,a=!0,c=45,l=2;s(),d(),u()}();
      });
   });
}(jQuery));

E adicione ao CSS:

Código:
#background-canvas {
    position: fixed;
}


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5785

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

Resolvido Re: Fundo do fórum animado

Mensagem por Jhool em 25/08/17, 02:51 pm

Tem alguma forma de trocar a cor das bolinhas?
avatar

Jhool
Nível 8

Masculino
Inscrito dia : 10/01/2017
Mensagens : 149
Pontos Ativos : 243

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

Resolvido Re: Fundo do fórum animado

Mensagem por Kyo Panda em 25/08/17, 02:55 pm

No código, procure por:

Código:
rgba

Ele indica qual cor será desenhada na tela. Se quisesse mudar o azul para vermelho, por exemplo:

Código:
rgba(0,146,255

Ficaria:

Código:
rgba(255,0,0


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5785

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

Resolvido Re: Fundo do fórum animado

Mensagem por Jhool em 29/08/17, 02:55 pm

Resultou, obrigado, pode fechar.
avatar

Jhool
Nível 8

Masculino
Inscrito dia : 10/01/2017
Mensagens : 149
Pontos Ativos : 243

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

Resolvido Re: Fundo do fórum animado

Mensagem por Kyo Panda em 30/08/17, 10:47 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5785

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

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