Jump to content


Photo

Sombras Laterais No Layout


  • Faça o login para participar
3 replies to this topic

#1 THCB

THCB

    Novato no fórum

  • Usuários
  • 9 posts
  • Sexo:Não informado

Posted 19/06/2008, 21:18

Oi, estou fazendo um site que tem sombras laterais no layout.

Para entender melhor o que estou dizendo, coloquei na net a imagem do layout: http://www.propagare.net/bit9-site

O que quero fazer é a sombra da esquerda e a da direita no meu layout, mas estou encontrando os seguintes problemas:

1 - Pensei em cortar um filete horizontal que englobe a sombra da esquerda e da direita, colocar como background da div geral (que engloba tudo) e mandar repetir em y. Assim teria um site que o conteúdo pudesse crescer na altura.

Mas, como meu fundo é um gradiente, eu tenho diferentes tonalidades de cores ao longo do site, e consequentemente ao longo das sombras. Por exemplo: na parte do topo tenho cores mais escuras, no rodape cores mais claras. Ou seja, gradiente. Então eu não posso cortar a imagem da sombra e mandar repetir, pois ao cortar essa imagem estarei pegando seu fundo que pode ser diferente na parte debaixo e de cima.

Aí pensei: é so salvar a sombra com fundo transparente em GIF. No CSS a imagem ficou branca e sem sombra alguma.
Aí pensei: vo salvar a sombra em PNG então. Mas lembrei que o IE 6 não lê PNG transparente.
Aí pensei:vo ver um javascript pra fazer o IE 6 ler fundo transparente. Até achei o javascript para isto, mas ele não possibilita eu mandar o background repetir (repeat, repeat-x,repeat-y). O que estraga os planos de fazer o site com um layout que cresça de acordo com o conteúdo.

Aí pensei: vo pedir ajuda no forum como ultima saida dessa enrascada...hehehe

Alguém pode me dar uma luz?
Qualquer idéia já é bem vinda.

Abraços

#2 Rafael'ss

Rafael'ss

    Novato no fórum

  • Usuários
  • 7 posts
  • Sexo:Não informado

Posted 20/06/2008, 01:09

Aconteceu o mesmo problema comigo, meu Photoshop salvava o GIF completamente "branco".
Mas quase ninguem ainda usa IE 6, até pq a atualização automatica do Windows baixa o 7 automaticamente (fiquei com um nojo disso quando usava Windows XP).

Acho que o melhor geito¹ mesmo é usar PNG transparente, ou então tenta usar outro hack..
Ou então faz um esquema com duas sombras, uma que ocupe o espaço com o degradê, e a outra pra ocupar o resto.. tipo com tabelas ou sei lá, isso é completamente contra os padrões mas funcionava comigo, até eu decidir que ficava melhor em PNG transparente..

Mas ai pra vc decidir mesmo, só avaliando o público alvo.. vc podia fazer uma enquete sobre o navegador usado, mts sites fazem isso.. LOL'z..

Flw's

¹Jeito ou Geito? oO..

#3 THCB

THCB

    Novato no fórum

  • Usuários
  • 9 posts
  • Sexo:Não informado

Posted 20/06/2008, 08:31

Oi Rafaels,

então acho que o jeito vai ser eu fazer 2 divs mesmo. Uma com a sombra no fundo degrade outra com a sombra no fundo onde acaba o degrade, pois deixar o pessoal que usa Ie 6 de fora, com PNG, eu não posso. Pelo que vi tem bastante gente ainda usando sim. Vejo isso pelas pessoas que conheço.

Se alguem tiver mais ideias, postem por favor :D

Obrigada Rafael :D e é jeito com J ....hehehe

#4 Martin Muller

Martin Muller

    Novato no fórum

  • Usuários
  • 1 posts
  • Sexo:Não informado

Posted 19/07/2008, 21:10

Oi Rafaels,

então acho que o jeito vai ser eu fazer 2 divs mesmo. Uma com a sombra no fundo degrade outra com a sombra no fundo onde acaba o degrade, pois deixar o pessoal que usa Ie 6 de fora, com PNG, eu não posso. Pelo que vi tem bastante gente ainda usando sim. Vejo isso pelas pessoas que conheço.

Se alguem tiver mais ideias, postem por favor :D

Obrigada Rafael :D e é jeito com J ....hehehe


Boa noite THCB,

Achei este script em javascript que funcionou para PNG32 no IE6 e no Firefox, veja o link: http://homepage.ntlw...la/pnghowto.htm

Abraços!

Martin




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq