Indice del forum Olimpo Informatico
I Forum di Zeus News
Leggi la newsletter gratuita - Attiva il Menu compatto
 
 FAQFAQ   CercaCerca   Lista utentiLista utenti   GruppiGruppi   RegistratiRegistrati 
 ProfiloProfilo   Messaggi privatiMessaggi privati   Log inLog in 

    Newsletter RSS Facebook Twitter Contatti Ricerca
Resize immagine dello sfondo
Nuovo argomento   Rispondi    Indice del forum -> Linguaggi per Internet
Precedente :: Successivo  
Autore Messaggio
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 05 Feb 2007 13:02    Oggetto: Resize immagine dello sfondo Rispondi citando

Perso!
Ho perso i riferimenti a delle istruzioni che ho trovato giorni fa per adattare automaticamente in html l'immagine dello sfondo in funzione delle varie risoluzioni.
In soldoni io ho un'immagine di fondo che a 800x600 copre tutta la pagina.
Se però viene vista ad altre risoluzioni ho la parziale ripetizione dell'immagine per la parte che non viene ricoperta dalla stessa.
A 1280x800 la faccenda si fa drammatica.
Chi mi aiuta?
Grazie
Top
Profilo Invia messaggio privato
kluster
Dio maturo
Dio maturo


Registrato: 15/04/06 13:14
Messaggi: 2898

MessaggioInviato: 05 Feb 2007 13:16    Oggetto: Rispondi citando

Allora, devi personalizzare lo sfondo tramite css.


tra il tag HEAD metti questo:
Codice:

<style type="text/css">
BODY
{
   background-attachment: fixed;
   background-image: url(/TUOCARTELLA/TUA_IMMAGINE);
   background-repeat: no-repeat;
   background-position: top center;
}
</style>


in particolare:
background-image:url('IMMAGINE') inserisce come è facile dedurre l'immagine nello sfondo.
background-attachment puo' essere fixed o scroll.
Identifica come l'immagine è collegata alla pagina.
fixed se la pagina scrolla, l'immagine invece rimane fissa nella sua posizione iniziale e i contenuti invece ci scrollano sopra
scroll invece l'immagine scorre come se fosse una normale immagine inserita nel body

background-repeat: no-repeat |repeat | repeat-x | repeat-y
server per la ripetizione dell'immagine per riempire lo spazio del body.
repeat-x ripete sulla coordinanate x (quindi ripetizione orizzontale)
repeat-y ripete sulle coordinate y (quindi ripetizione verticale)
repeat ripete sia su x che su y
no-repeat inserisce l'immagine 1 volta sola e non ripete.

background-position: [POSIZIONE_ORIZZONTALE] [POSITIONE_VERTICALE]
imposta la dimensione di piazzamento dell'immagine.
Quindi
background-position: center center, posiziona l'immagine al centro del body in orizzontale ed in verticale.
background-position: top left, posiziona l'immagine in alto allineata a sinistra
background-position: 100px 273px, posiziona l'immagine a 100px dal top e a 273px a sinistra.
background-position:50% 50%, posiziona l'immagine alla meta' dell'altezza e alla meta' della larghezza del body.
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 05 Feb 2007 14:31    Oggetto: Rispondi citando

Grazie, provo e poi ti dirò.
Ciao.
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 05 Feb 2007 15:22    Oggetto: Immagine centrale Rispondi citando

Ciao, purtroppo non funge.

Forse sono io che scrivo male, ma tuttavia se copio le tue istruzioni nel blocconote e poi li rimetto dopo HEAD, al salvataggio le righe si spostano e non mantengono la struttura iniziale, classico quando vi è errore.

Comunque mi sembra di capire, avendo già nella pagina un altro STYLE, che è meglio creare un foglio css esterno, e richiamarlo dalla pagina interessata.
Ho provato anche questa soluzione, ma il codice non è accettato cosi com'è scritto e si ... "smonta" come sopra.

Come hai capito non sono un mago, ....mi arrangio come posso.

Aspetto news.
Ciao
Top
Profilo Invia messaggio privato
kluster
Dio maturo
Dio maturo


Registrato: 15/04/06 13:14
Messaggi: 2898

MessaggioInviato: 05 Feb 2007 16:59    Oggetto: Rispondi citando

passa il link dove hai montato la pagina, vedo un attimo, al massimo butta qui le righe di codice dello stile [non tutta la pagina]
Ciao
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 05 Feb 2007 18:01    Oggetto: Resize Immagine di fondo Rispondi citando

Questo è l'inizio pagina.
C'è uno style relativo ad un file audio:

<head>
<title>Pagina Home</title>
<meta name="Keywords" content="Strumenti di misura">
<meta name="Description" content="Strumenti di Misura">
<meta name="Author" content="postmaster">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<meta http-equiv="Content-Language" content="it">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<bgsound src="BuonGiorno.mp3" loop="0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<style>
<!--
bgsound { }
-->
</style>
</head>

<body background="images/immaginesfondo.jpg" leftmargin="12">

<div align="left">
<table border="0" width="756" height="417" cellspacing="0" cellpadding="0">
<tr>
ecc......
Ciao.
Top
Profilo Invia messaggio privato
kluster
Dio maturo
Dio maturo


Registrato: 15/04/06 13:14
Messaggi: 2898

MessaggioInviato: 05 Feb 2007 18:22    Oggetto: Rispondi citando

mamma mia cosa ho visto, lavori con FrontPage.
Very Happy, scherzo via, è solo un mio punto di vista.

A parte gli scherzi.
correggi
<body background="images/immaginesfondo.jpg" leftmargin="12">

in semplice
<body>
e
<style>
<!--
bgsound { }
-->
</style>
in
Codice:

<style type="text/css">
<!--
bgsound { }

BODY
{
margin:0;
padding: 0px 12px 0px 0px;
background-image:Url('images/immaginesfondo.jpg');
background-position:top center;
background-repeat:no-repeat;
}
-->
</style>
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 05 Feb 2007 19:07    Oggetto: resize immagine Rispondi citando

Be,
ti avevo avvertito che non ero uno smanettone, e dato che il mio lavoro principale è più su hardware, FrontPage viene utilizzato perchè è semplice e abbastanza veloce. (per me)

Capisco che non è il massimo oggi, anzi... ma non ho il tempo materiale, almeno per ora, per altri editori più performanti.

Grazie per la risposta. Mercoledi provo il tutto e poi ti rispondo.
Riciao
Top
Profilo Invia messaggio privato
kluster
Dio maturo
Dio maturo


Registrato: 15/04/06 13:14
Messaggi: 2898

MessaggioInviato: 05 Feb 2007 19:19    Oggetto: Re: resize immagine Rispondi citando

dinogel ha scritto:
Be,
ti avevo avvertito che non ero uno smanettone, e dato che il mio lavoro principale è più su hardware, FrontPage viene utilizzato perchè è semplice e abbastanza veloce. (per me)

Capisco che non è il massimo oggi, anzi... ma non ho il tempo materiale, almeno per ora, per altri editori più performanti.


ma si, ci mancherebbe, scherzavo Smile ognuno deve lavorare con il prodotto che gli permette il massimo risultato con il minimo sforzo.
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 07 Feb 2007 15:51    Oggetto: Rispondi citando

Ciao,
responso dopo le prove: non ci siamo.

Ovvero, il codice una volta salvata la pagina si presenta con questo layout:

Citazione:
<style type="text/css">
<!--
bgsound { }
body { background-image: url('images/NotteMare_1024x768.jpg'); background-repeat:
no-repeat; margin: 0; padding-left: 0px; padding-right: 12px;
padding-top: 0px; padding-bottom: 0px; background-position:
top center }
-->
</style>


ovvero si smonta.
Il risultato è che l?immagine NotteMare_1024x768 pixel, è parziale con 800x600; è perfetta con 1024x800; ha bordi bianchi laterali con 1024x768.

Che fare? Sad
Ciao.
Top
Profilo Invia messaggio privato
horus
Macchinista
Macchinista


Registrato: 22/03/05 10:48
Messaggi: 2554
Residenza: Sirio e dintorni

MessaggioInviato: 07 Feb 2007 16:43    Oggetto: Rispondi citando

Con i CSS non si può fare quello che vuoi. E' previsto un background-size in CSS3 ma prima che sia supportato da tutti i browser passeranno anni se non decenni.

Ci potrebbero essere alternative tipo usare un div come contenitore del tutto e mettere un'immagine in quello settando le dimensioni in percentuali oppure con qualche script lato client.
Top
Profilo Invia messaggio privato
dinogel
Eroe
Eroe


Registrato: 07/09/05 11:42
Messaggi: 55
Residenza: Milano

MessaggioInviato: 07 Feb 2007 18:22    Oggetto: E' possibile Rispondi citando

Carissimo Horus,

Punto 1 - Dal mio primo post si evvince che la cosa è possibilissima, l'ho vista, ma che ho perso i riferimenti per farla.

Punto 2 - Non ho mai richiesto che la funzione fosse universale per tutti i
browser, mi basta IE.

Punto 3 - Non ho detto che deve essere fatta con CSS.

Punto 4 Finale. - In definitiva hai dato qualche aiuto, ma ....in pratica? Crying or Very sad

Salutoni
Top
Profilo Invia messaggio privato
SverX
Supervisor Macchinisti
Supervisor Macchinisti


Registrato: 25/03/02 12:16
Messaggi: 11810
Residenza: Tokelau

MessaggioInviato: 08 Feb 2007 15:57    Oggetto: Re: E' possibile Rispondi citando

se qualunque soluzione vale allora potresti preparare 3 immagini diverse e impostare come sfondo quella adeguata via Javascript...
Top
Profilo Invia messaggio privato HomePage
horus
Macchinista
Macchinista


Registrato: 22/03/05 10:48
Messaggi: 2554
Residenza: Sirio e dintorni

MessaggioInviato: 15 Feb 2007 17:11    Oggetto: Rispondi

Punto 1 e 3 - Infatti ho detto che con i CSS non era possibile farla. Visto che kluster suggeriva soluzioni CSS mi sembrava doveroso precisare che non si potesse fare con quel metodo prima che lui diventasse matto a cercare di risovere il tuo problema.

Punto 2 - Non hai neppure detto che doveva essere specifica di IE, hai solo parlato di html (che non mi risulta essere proprietario di un browser in particolare).

Punto 4 - In pratica ti ho suggerito alcune vie da approfondire: div con dimensioni in percentuale o script lato client (poi parzialmente approfondito da SverX). Non so cosa avevi visto e non mi viene in mente nessun altro modo per adattare automaticamente in html (visto che stiamo interpretando alla lettera i messaggi) un'immagine di sfondo.

Quello che cercavo di suggerire era una soluzione elegante che andasse bene su un sito web potenzialmente accessibile da tutti. Se tu hai esigenze specifiche e i miei suggerimenti non ti hanno aiutato (o se ti hanno infastidito) mi dispiace, prova a specificare più nel dettaglio quali sono i requisiti di quello che cerchi e magari i suggerimenti saranno più mirati.
Top
Profilo Invia messaggio privato
Mostra prima i messaggi di:   
Nuovo argomento   Rispondi    Indice del forum -> Linguaggi per Internet Tutti i fusi orari sono GMT + 2 ore
Pagina 1 di 1

 
Vai a:  
Non puoi inserire nuovi argomenti
Non puoi rispondere a nessun argomento
Non puoi modificare i tuoi messaggi
Non puoi cancellare i tuoi messaggi
Non puoi votare nei sondaggi