| Precedente :: Successivo | 
	
	
		| Autore | Messaggio | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 05 Feb 2007 13:02    Oggetto: Resize immagine dello sfondo |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| kluster Dio maturo
 
  
 
 Registrato: 15/04/06 13:14
 Messaggi: 2898
 
 
 | 
			
				|  Inviato: 05 Feb 2007 13:16    Oggetto: |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 05 Feb 2007 14:31    Oggetto: |   |  
				| 
 |  
				| Grazie, provo e poi ti dirò. Ciao.
 |  | 
	
		| Top |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 05 Feb 2007 15:22    Oggetto: Immagine centrale |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| kluster Dio maturo
 
  
 
 Registrato: 15/04/06 13:14
 Messaggi: 2898
 
 
 | 
			
				|  Inviato: 05 Feb 2007 16:59    Oggetto: |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 05 Feb 2007 18:01    Oggetto: Resize Immagine di fondo |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| kluster Dio maturo
 
  
 
 Registrato: 15/04/06 13:14
 Messaggi: 2898
 
 
 | 
			
				|  Inviato: 05 Feb 2007 18:22    Oggetto: |   |  
				| 
 |  
				| mamma mia cosa ho visto, lavori con FrontPage. 
  , 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 |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 05 Feb 2007 19:07    Oggetto: resize immagine |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| kluster Dio maturo
 
  
 
 Registrato: 15/04/06 13:14
 Messaggi: 2898
 
 
 | 
			
				|  Inviato: 05 Feb 2007 19:19    Oggetto: Re: resize immagine |   |  
				| 
 |  
				|  	  | 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
  ognuno deve lavorare con il prodotto che gli permette il massimo risultato con il minimo sforzo. |  | 
	
		| Top |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 07 Feb 2007 15:51    Oggetto: |   |  
				| 
 |  
				| 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?
   Ciao.
 |  | 
	
		| Top |  | 
	
		|  | 
	
		| horus Macchinista
 
  
  
 Registrato: 22/03/05 10:48
 Messaggi: 2554
 Residenza: Sirio e dintorni
 
 | 
			
				|  Inviato: 07 Feb 2007 16:43    Oggetto: |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		| dinogel Eroe
 
  
  
 Registrato: 07/09/05 11:42
 Messaggi: 55
 Residenza: Milano
 
 | 
			
				|  Inviato: 07 Feb 2007 18:22    Oggetto: E' possibile |   |  
				| 
 |  
				| 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?
   
 Salutoni
 |  | 
	
		| Top |  | 
	
		|  | 
	
		| SverX Supervisor Macchinisti
 
  
  
 Registrato: 25/03/02 12:16
 Messaggi: 11861
 Residenza: Tokelau
 
 | 
			
				|  Inviato: 08 Feb 2007 15:57    Oggetto: Re: E' possibile |   |  
				| 
 |  
				| se qualunque soluzione vale allora potresti preparare 3 immagini diverse e impostare come sfondo quella adeguata via Javascript... |  | 
	
		| Top |  | 
	
		|  | 
	
		| horus Macchinista
 
  
  
 Registrato: 22/03/05 10:48
 Messaggi: 2554
 Residenza: Sirio e dintorni
 
 | 
			
				|  Inviato: 15 Feb 2007 17:11    Oggetto: |   |  
				| 
 |  
				| 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 |  | 
	
		|  | 
	
		|  |