WebSite X5Help Center

 
Antonio P.
Antonio P.
User

Content slider a tutto schermo  it

Autore: Antonio P.
Visite 1475, Followers 4, Condiviso 0  

Salve a tutti. Vorrei creare attreverso l'oggetto content slider un cosa simile a questa:

sHo usato l'oggetto content slieder estendendo alla larghezza della finestra del Browser:

Solo che il risultato è questo:

in pratica quelle vorrei sparissero quelle due strisce bianche. Come potrei fare?

Postato il
29 RISPOSTE - 5 UTILI
Stiac Engineering
Stiac Engineering
User

Dovresti individuare il nome dell'oggetto e inserire un codice analogo, sostituendo "XXXX" con quello dell'oggetto :

#imObjectContentSlider_XXXX {
min-height: 100vh!important;
}

Oppure:

#imPageRow_1 { min-height: 100vh!important; }

Puoi vedere un esempio del risultato qui.

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

Ambedue i codici li puoi inserire in un oggetto Codice HTML in "Esperto".

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

Dovresti anche estendere a tutto schermo l'oggetto. Step 4 > Estendi.

Leggi di più
Postato il da Stiac Engineering
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... LINK...?...

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Fabio C.
Fabio C.
User

Se metti un'immagine con dimenzioni appropriate, estendi, porti tutti i margini a zero, non ci dovrebbe essere bisogno di codici esterni:

Qui un esempio

Leggi di più
Postato il da Fabio C.
Mauro B.
Mauro B.
User

Ciao Gabriele,

non mi è chiara la procedura da seguire...Potresti essere più preciso?

Grazie.

Mauro

Gabriele C.
Dovresti individuare il nome dell'oggetto e inserire un codice analogo, sostituendo "XXXX" con quello dell'oggetto : #imObjectContentSlider_XXXX { min-height: 100vh!important; } Oppure: #imPageRow_1 { min-height: 100vh!important; } Ambedue i codici li puoi inserire in un oggetto Codice HTML in "Esperto".
Leggi di più
Postato il da Mauro B.
Stiac Engineering
Stiac Engineering
User

Okay. Allora ci sono due alternative. La prima mi è stata indicata gentilmente da Vincenzo Errico. La seconda non ricordo.

Per la prima ho inserito il codice indicato in un oggetto "Codice HTML" nella stessa pagina, nella sezione Esperto di quest'ultima, avendo cura a individuare il giusto selettore di id dell'oggetto:

nNella seconda basta inserire il codice nell'oggetto "Codice HTML" in Esperto.

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

Spero di non aver fatto errori e di ricordare correttamente la fonte.

Leggi di più
Postato il da Stiac Engineering
Antonio P.
Antonio P.
User
Autore
Patrizia B.
Se metti un'immagine con dimenzioni appropriate, estendi, porti tutti i margini a zero, non ci dovrebbe essere bisogno di codici esterni: Qui un esempio

Non è quello che cerco

Leggi di più
Postato il da Antonio P.
Antonio P.
Antonio P.
User
Autore
Gabriele C.
Dovresti individuare il nome dell'oggetto e inserire un codice analogo, sostituendo "XXXX" con quello dell'oggetto : #imObjectContentSlider_XXXX { min-height: 100vh!important; } Oppure: #imPageRow_1 { min-height: 100vh!important; } Puoi vedere un esempio del risultato qui.

Grazie per la risposta. Credo di aver trovato il nome dell'oggetto (non sono sicuro dovrebbe essere imObjectContentSlider_44) ma non ho capito dove mettere il codice. Ho provato ad andare su: Proprietà - Esperto - e qui ho fatti vari tentativi (prima e dopo chiusura tag Head e prima e dopo chiusura tag Body) ma niente

Leggi di più
Postato il da Antonio P.
Stiac Engineering
Stiac Engineering
User

Figurati Antonio!

Per trovare il nome basta ispezionare il codice dal Browser. Se fai ispeziona sullo stesso oggetto ti riporta lì.

Il codice va inserito nella pagina stessa ovvero nello Step 4, per comodità io lo metto nell'oggetto Codice HTML (Step 4 > Oggetto Codice HTML > Esperto).

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

es.

Leggi di più
Postato il da Stiac Engineering
Fabio C.
Fabio C.
User
antonio P.
Patrizia B. Se metti un'immagine con dimenzioni appropriate, estendi, porti tutti i margini a zero, non ci dovrebbe essere bisogno di codici esterni: Qui un esempio Non è quello che cerco

Quando hai tempo mi spieghi perchè non è quello che cerchi ?

Leggi di più
Postato il da Fabio C.
Antonio P.
Antonio P.
User
Autore
Patrizia B.
antonio P.Patrizia B. Se metti un'immagine con dimenzioni appropriate, estendi, porti tutti i margini a zero, non ci dovrebbe essere bisogno di codici esterni: Qui un esempio Non è quello che cerco Quando hai tempo mi spieghi perchè non è quello che cerchi ?

Perché non voglio un'immagine fissa a tutto schermo ma più immagini in cui all'interno vi sono scritte dinamiche. Il content slider farebbe al caso mio ma anche se metto immagini grandi, estendo ed imposto tutti i margini a 0 non va a tutto schermo ma restano le due strisce ai lati. Credo che la soluzione sia quella di Gabriele anche se non riesco a capire dove sbaglio. Con il codice che mi ha dato fa dei movimenti ma non va a tutto schermo

Leggi di più
Postato il da Antonio P.
Stiac Engineering
Stiac Engineering
User

Posta il link così ti possiamo dare una mano.

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

A me funziona. C'è un piccolo difetto da mobile, ma sembra fare il suo dovere.

Leggi di più
Postato il da Stiac Engineering
Antonio P.
Antonio P.
User
Autore

Chiedo scusa a tutti ma sono un'idiota. Invece di inserire l'immagine nella sezione sfondo la inserivo nella sezione immagine embarassed. Ora a va. Grazie e scusatemi ancora

Leggi di più
Postato il da Antonio P.
Fabio C.
Fabio C.
User
antonio P.
Perché non voglio un'immagine fissa a tutto schermo ma più immagini in cui all'interno vi sono scritte dinamiche. Il content slider farebbe al caso mio ma anche se metto immagini grandi, estendo ed imposto tutti i margini a 0 non va a tutto schermo ma restano le due strisce ai lati. Credo che la soluzione sia quella di Gabriele anche se non riesco a capire dove sbaglio. Con il codice che mi ha dato fa dei movimenti ma non va a tutto schermo

Nel mio Esempio la seconda immagine, se vedi, è fatta con il Content Slider e è a tutto schermo ottenuto snza codici esterni, comunque se hai risolto e ti va bene apposto wink

Leggi di più
Postato il da Fabio C.
Stiac Engineering
Stiac Engineering
User

Okay! Nessun problema, errare è umano. Io persevero cool

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User
Patrizia B.
Nel mio Esempio la seconda immagine, se vedi, è fatta con il Content Slider e è a tutto schermo ottenuto snza codici esterni, comunque se hai risolto e ti va bene apposto

Se ti riferisci al furgone, io vedo sempre le strisce bianche di lato.

Leggi di più
Postato il da Stiac Engineering
Giuseppe Guida
Giuseppe Guida
User

Errare Humanum Est... Perseverare è a Ovest wink Infatti proprio non riuscivo a capire a cosa servisse il codice poichè bastava estendere il tutto a pieno schermo come detto da Patrizia e, naturalmente, le immagini andavano inserite come Immagini di Sfondo della Content Slider e non come Immagini sovrapposte allo sfondo. 

Leggi di più
Postato il da Giuseppe Guida
Stiac Engineering
Stiac Engineering
User
Giuseppe Guida
Errare Humanum Est... Perseverare è a Ovest Infatti proprio non riuscivo a capire a cosa servisse il codice poichè bastava estendere il tutto a pieno schermo come detto da Patrizia e, naturalmente, le immagini andavano inserite come Immagini di Sfondo della Content Slider e non come Immagini sovrapposte allo sfondo. 

Per il semplice motivo che non tutte le foto occupano tutta l'altezza. Ad esempio io ho risolto con il codice citato. Senza questo è il risultato:

Leggi di più
Postato il da Stiac Engineering
Stiac Engineering
Stiac Engineering
User

Se poi il metodo è errato metto aventi le mani innocent

Leggi di più
Postato il da Stiac Engineering
Fabio C.
Fabio C.
User
Gabriele C.
Se poi il metodo è errato metto aventi le mani

Il metodo non è errato, il mio principio è che se lo fa il programma non metto codici esterni, detto questo come punto fermo per far funzionare a tutto schermo il content slider devi di avere immagini con misure adeguate e con misure tutte uguali.

Leggi di più
Postato il da Fabio C.
Giuseppe Guida
Giuseppe Guida
User

Gabriele, per l'altezza ti do ragione ma Antonio aveva evidenziato degli spazi laterali a destra e sinistra e non mi spiegavo perchè non andasse bene quanto consigliato da Patrizia. 

Leggi di più
Postato il da Giuseppe Guida
Fabio C.
Fabio C.
User
Giuseppe Guida
Gabriele, per l'altezza ti do ragione.

Se le immagini hanno tutte le stesse misure, anche l'altezza non ha problemi in quento settabile da programma. Comunque, ripeto, se ha risolto sono contenta.

Leggi di più
Postato il da Fabio C.
Giuseppe Guida
Giuseppe Guida
User

Sì Patrizia, l'altezza è settabile dalle impostazioni della Content Slider ma sarà comunque fissa, avrà un valore fisso in px e non si adatterà all'altezza dei vari dispositivi sui quali il sito verrà visualizzato. 

Leggi di più
Postato il da Giuseppe Guida
Antonio P.
Antonio P.
User
Autore
Patrizia B.
Giuseppe Guida Gabriele, per l'altezza ti do ragione. Se le immagini hanno tutte le stesse misure, anche l'altezza non ha problemi in quento settabile da programma. Comunque, ripeto, se ha risolto sono contenta.

Si ho risolto. Alla fine non c'era bisogno del codice. Scusate ancora. Qui il risultato

Leggi di più
Postato il da Antonio P.
Stiac Engineering
Stiac Engineering
User

L'importante è che hai risolto Antonio! Bel e buon sito! wink

Io ho usato il codice in quanto non sono riuscita a trovare il giusto equilibrio. Magari da Desktop andava bene, ma da mobile no etc.

Leggi di più
Postato il da Stiac Engineering