Fórum OpenCart Brasil

Eae Galera...
Queria saber qual o tamanho de imagem ideal BG (BACKGROUND) para mostrar imagem completa em todos os diferentes tamanhos de monitores?
Pois tenho 2 monitores, e em um fica perfeito e no maior fica faltando imagem dai ela e duplicada.

Qual tipo de img tenho que usar para background? JPG? Quantos mb a imagem tem que ter por padrão para carregar a pagina com perfeição?
Abraçoss!

mauricioramisses escreveu:Eae Galera...
Queria saber qual o tamanho de imagem ideal BG (BACKGROUND) para mostrar imagem completa em todos os diferentes tamanhos de monitores?
Pois tenho 2 monitores, e em um fica perfeito e no maior fica faltando imagem dai ela e duplicada.

Qual tipo de img tenho que usar para background? JPG? Quantos mb a imagem tem que ter por padrão para carregar a pagina com perfeição?
Abraçoss!

Pelo que entendi, a largura da div que abriga o conteúdo da loja tem largura fixa, certo?

Faça a imagem de forma que se adeque a esse seu monitor menor.

Depois, é só configurar no CSS para a imagem ficar centralizada e sem repetição horizontal (repetição vertical a seu critério, dependendo da imagem, assim como o attachment fixed opcional). Vai ficar bom no maior também, e o que sobrar, fica branco (ou com a cor que vc definir no background-color).

Não lembro agora onde encontrei, mas há algum tempo tive necessidade de utilizar um recurso desses e encontrei no Google a solução, lembro-me que a solução era bem simples, com uma combinação de CSS e JQuery uma única imagem se adaptava a qualquer resolução de tela.

Espero ter ajudado

Renato Frota escreveu:

mauricioramisses escreveu:Eae Galera...
Queria saber qual o tamanho de imagem ideal BG (BACKGROUND) para mostrar imagem completa em todos os diferentes tamanhos de monitores?
Pois tenho 2 monitores, e em um fica perfeito e no maior fica faltando imagem dai ela e duplicada.

Qual tipo de img tenho que usar para background? JPG? Quantos mb a imagem tem que ter por padrão para carregar a pagina com perfeição?
Abraçoss!

Pelo que entendi, a largura da div que abriga o conteúdo da loja tem largura fixa, certo?

Faça a imagem de forma que se adeque a esse seu monitor menor.

Depois, é só configurar no CSS para a imagem ficar centralizada e sem repetição horizontal (repetição vertical a seu critério, dependendo da imagem, assim como o attachment fixed opcional). Vai ficar bom no maior também, e o que sobrar, fica branco (ou com a cor que vc definir no background-color).

Bom, o que eu preciso e bem simples, ja aprendi a colocar uma imagem como background, mas o problema é que em alguns monitores ela repete, a soluçao seria colocar uma imagem grande para que se ajuste ao monitor maios e automaticamente ao menor?
Como eu faço para configuras o css para que a imagem fique centralizada e sem repetição orizontal como voce falou?
A minha outra pegunata é qual serial o formato de imagem ideal para bg, JPG? Quantos mb ela tem que ter para não zuar o carregamento?
Obrigado

Manoel Vidal escreveu:Não lembro agora onde encontrei, mas há algum tempo tive necessidade de utilizar um recurso desses e encontrei no Google a solução, lembro-me que a solução era bem simples, com uma combinação de CSS e JQuery uma única imagem se adaptava a qualquer resolução de tela.

Espero ter ajudado

É exatamente o que preciso, que a imagem se adapte a qualquer monitor.
Mas não sei nem por onde começar. Qualquer LUZ, compartilhe. abraços

O formato independe. O tempo de carregamento depende unicamente do tamanho da imagem (do "peso" do arquivo, não a dimensão em pixels).

Programas como o Paint.NET (um Paint melhorado) permitem você escolher formato na hora de salvar, e nível de qualidade. Além disso, o algoritmo dele é muito bom! Um JPG de 3MP por exemplo, com quase 1 MB de tamanho, ao salvar com 85% da qualidade, pode ter seu peso reduzido para menos de 30% do original (300kB).

Renato Frota escreveu:

Código: Selecionar todos

background: #FFF url('caminho/imagem.jpg') no-repeat fixed no-repeat center top;

O formato independe. O tempo de carregamento depende unicamente do tamanho da imagem (do "peso" do arquivo, não a dimensão em pixels).

Programas como o Paint.NET (um Paint melhorado) permitem você escolher formato na hora de salvar, e nível de qualidade. Além disso, o algoritmo dele é muito bom! Um JPG de 3MP por exemplo, com quase 1 MB de tamanho, ao salvar com 85% da qualidade, pode ter seu peso reduzido para menos de 30% do original (300kB).

aonde eu colo esse codigo? stelysheet?
meu paint net parou de funcionar e nao consigo intalar de novo por que da um erro. Ja tentei varias pesquisa no google, varios procedimentos e ainda nao consertei.
Acho que so formatando o PC mesmo, mas nao tenho tempo para formatar agora. net fremework dev ter causado o problema, mesmo reinstalando nao da certo.

mauricioramisses escreveu:

Renato Frota escreveu:

Código: Selecionar todos

background: #FFF url('caminho/imagem.jpg') no-repeat fixed no-repeat center top;

O formato independe. O tempo de carregamento depende unicamente do tamanho da imagem (do "peso" do arquivo, não a dimensão em pixels).

Programas como o Paint.NET (um Paint melhorado) permitem você escolher formato na hora de salvar, e nível de qualidade. Além disso, o algoritmo dele é muito bom! Um JPG de 3MP por exemplo, com quase 1 MB de tamanho, ao salvar com 85% da qualidade, pode ter seu peso reduzido para menos de 30% do original (300kB).

aonde eu colo esse codigo? stelysheet?
meu paint net parou de funcionar e nao consigo intalar de novo por que da um erro. Ja tentei varias pesquisa no google, varios procedimentos e ainda nao consertei.
Acho que so formatando o PC mesmo, mas nao tenho tempo para formatar agora. net fremework dev ter causado o problema, mesmo reinstalando nao da certo.

Para arrumar o Paint.NET, tente abrir essas pastas:

C:\Windows\Microsoft.NET\Framework\v2.0.50727\CONFIG
C:\Windows\Microsoft.NET\Framework\v4.0.30319\Config
C:\Windows\Microsoft.NET\Framework64\v2.0.50727\CONFIG
C:\Windows\Microsoft.NET\Framework64\v4.0.30319\Config

Delete os arquivos machine.config das 4, tire uma cópia de cada um dos respectivos machine.config.default e renomeie as cópias para machine.config

na propriedade background coloca width 100%

Renato Frota escreveu: Para arrumar o Paint.NET, tente abrir essas pastas:

C:\Windows\Microsoft.NET\Framework\v2.0.50727\CONFIG
C:\Windows\Microsoft.NET\Framework\v4.0.30319\Config
C:\Windows\Microsoft.NET\Framework64\v2.0.50727\CONFIG
C:\Windows\Microsoft.NET\Framework64\v4.0.30319\Config

Delete os arquivos machine.config das 4, tire uma cópia de cada um dos respectivos machine.config.default e renomeie as cópias para machine.config

Fiz o que pediu e instalei o Paint.net. Durante a instalação apareceu.
Houve um erro ap Instalar Paint.Net. (1603)
Erro fatal durante a instalação.

Fiz exatamente como informou e o problema continua.