Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

gilbertjuniors

Como montar este layout

Recommended Posts

Pessoal, boa tarde.

 

Fiquei um tempo sem desenvolver nenhum website, estou cursando banco de dados e, resolvi reciclar meus conhecimentos de webdesign.

Me deparei com um tipo de layout onde os textos e imagens se movem em função da movimentação da barra de rolagem e, uma um background continua estático. (exemplo este site: http://www.devicelab.com.br).

Como eu crio este efeito dentro dos padrões W3C?

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

O nome desse efeito se chama Parallax, existem vários tutoriais na internet de como fazer, irei postar um aqui que me parece estar bem explicado:

https://tableless.com.br/parallax-simples-com-jquery-e-css/

 

Qualquer dúvida estamos aí.

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por jcvlanova
      Galera, dei uma olhada no Site https://www.fastly.com/ e percebi que a página é estruturada em tópicos circundados, divididos por uma espécie de caixas, boxes formados por linhas e curvas, alguém saberia me dizer como é possível fazer essas linhas curvas uma página html ???
    • Por ViniciusRamoa
      Eu peguei um site já pronto em laravel, minha ideia era só pegar o site que o cara distribuiu e mudar layout aos poucos para se adaptar para mim, eu sei, digamos, o intermediário de css e básico de Php e html, e o que eu quero alterar é só o básico como: cores, background e etc, mas mesmo eu alterando os arquivos css ou até mesmo apagando todos os arquivos css, NADA muda no site, como se fosse inútil os arquivos css, mudar a aparência no laravel é diferente? Qual o método?
      Vale lembrar que possui vários arquivos .blade (index.blade, footer.blade etc), isso tem algo a ver? Obrigado
    • Por ramonjba
      Olá pessoal. Estou desenvolvendo uma especie de monitoramento, estou utilizando o MATERIALIZE, desta forma, optei por não trabalhar com responsividade, pois preciso do máximo de informações possíveis na tela, seja desktop ou mobile, fazendo o ajuste de zoom se preciso. Fiquei cerca de dois anos sem programar, eu havia feito esse projeto para meu TCC, porém após finalizar, deixei parado e acabei perdendo. Com o tempo, algumas ideias em relação ao projeto também mudaram, e para apresentar a informações das `Torres de Internet`, utilizei o collapsible-header conforme imagem `projeto_monitor`, pois, ao clicar em cima do `equipamento`, ele apresenta informações relacionadas a ele. Estou tendo problemas para alinhar estes `collapsible-header ` pois preciso preencher toda a tela, sem deixar espaçamentos. Para isso, fiz uma classe CSS contendo: 
       
      .row .col.quadroTorre1 { margin-top: -10%; margin-bottom: 10%; } .row .col.quadroTorre2 { margin-top: -7.3%; margin-bottom: 10%; } .row .col.quadroTorre3 { margin-top: -30%; margin-bottom: 10%; } .row .col.quadroTorre4 { margin-top: -1.7%; margin-bottom: 10%; }  
      E fiz uma verificação no código, para ver qual o numero de equipamentos que a `Torre` que está acima tem. Porém, como podemos observar, na segunda linha funcionou preenchendo os espaços, mas pulando para a terceira linha, já possui uma lacuna em branco, onde deveria estar situado o elemento. Além disso, os elementos da segunda linha, acabam se sobrepondo, conforme imagem `projeto_sobrepor`. Como fiquei cerca de 2 anos sem programar, estou encontrando algumas dificuldades e empacando nelas. A parte de front-end é a que gera maior dificuldade. Se alguém puder me auxiliar, agradeço. 
       
      Edit: Se alguém tiver dicas de como posso melhorar o preenchimento das lacunas em branco. 
       


    • Por lukaizh
      Olá Galera,
       
      Estou iniciando um e-commerce pela Tray,e não entendo muito bem de css 
      eu gostaria de saber se tem como eu mudar o menu lateral esquerdo, para deixar ele na horizontal.
       
      e teria mais uma dúvida, se há alguma maneira de importar o site para o photoshop e depois pegar o css das camadas.
    • Por alisonalves
      Olá pessoal. Tenho uma dúvida que sei que é bem básica mas não estou conseguindo aprender sozinho. Antigamente usava o Dreamweaver e nele temos a opção de montar o template e definir quais as áreas do site serão editáveis, ou seja, o menu e a coluna direita aparecem em todas as páginas mas o conteúdo da esquerda é editável. Agora como estou aprendendo sobre layout responsivo, grids e tal gostaria de saber. Sem utilizar o dreamweaver como faço para deixar o menu e a coluna da direita fixas e poder editar apenas a coluna da esquerda? Como eu faço para mostrar para todas as paginas que a coluna da direita vai mostrar o mesmo conteúdo. Assim quando eu atualizar a coluna da direita já atualiza em todas as páginas. Obrigado pela força
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.