Z-index del footer 
Autore: Cesare A.
Visite 1528,
Followers 1,
Condiviso 0
Buona Sera,
ho un problema relativo al'assegnazione di uno z-index al background del Footer.
Sono riuscito ad assegnare uno z-index all' imFooterBg attraverso DevTools, e funziona come serve a me, ma ho potuto solo capire che dovrei modificarlo fisicamente dal file CSS della pagina.
Mi chiedevo se ci fosse qualche altro modo di richiamare via HTML la stringa imFooterBg del CSS ed integrarvi lo z-index senza agire fisicamente sul file ma dalla sezione Esperto del programma.
Accetto anche qualsiasi altra idea di soluzione a riguardo.
Ringrazio fin d'ora !!!
Postato il
... SEZIONE ESPERTO | ▪Codice personalizzato > Prima della chiusura del TAG </HEAD>...
... se l'oggetto è quello che hai indicato, prova con una di queste due stringhe di codice:
<style> #imFooterBg { z-index:20000;} </style>
... oppure:
<style> #imFooterBg { z-insex:20000 !important;} </style>
.
Autore
Buongiorno,
ti ringrazio TANTISSIMO KolAsim per il tuo aiuto; la prima stringa ha già funzinato, però mi sorge il problema che il comando ha effetto solo sui due breakpoint, mi spiego:
Ho settato il sito con i seguenti Breakpoint:
-1920
-1680
-1345
-958
-768
-600
-480
Il comando che mi hai dato funziona solo sui brakpoint 1345 e 958...come mai? Non credo che il sito abbia assegnato un nome diverso al footer in base al breakpoint. Adesso controllo su DevTools x le dimensioni dal 958 in giu mentre non saprei come fare per le versioni piu grandi xche non ho schermi così grandi a disposizione.
Ti ringrazio fin d'ora!!
... hai provato la seconda stringa ...?... ... dovrebbe avere priorità globale...
... controlla anche le impostazioni attive nei vari breakpoint...
... per poter io od altri valutare dovresti postare il LINK...
ciao
Autore
Grazie della pronta risposta!!
Si ho provato ma, invece di dargli priorità (!important) annulla l'azione!
Lo scopo è che il banner che ho inserito sul bottom della pagina, scompaia dietro al Footer.
Questo è il link del sito in costruzione areatest.villaaitigli.venezia.it/vat , e, se visualizzato entro i breakpoint 1345 e 958 si può già vedere che funziona a dovere...se si riduce la pagina o si usa uno schermo più grande, allora non funziona più!
Autore
Scusa, ecco il link giusto
http://areatest.villaaitigli.venezia.it/vat/index.html
...!... vedo che hai inserito codice extra in modo errato all'inizio della sezione HEAD che porta errore nella lettura della pagina...!...
... segui le loro istruzioni riportate tra i commenti...
... in teoria il primo <script> andrebbe nel pannello ESPERTO | Prima della chiusura di /HEAD...
... la seconda parte di codice <DIV> e <SCRIPT> prova ad inserirli in Oggetto Codice HTML, ...oppure a seconda dei risultati, nel pannello ESPERTO | Prima della chiusura del /BODY...
... eventualmente quando avrai sistemato fatti risentire...
.
Autore
Eccomi!
Allora, ho provato a fare la modifica che dicevi ma anche inserendo gli script nel posto giusto non cambia nulla.
Ho visto con il magnifico DevTool che ogni breakpoint possiede le sue specifiche info x #imFooterBg, quindi inserendo lo z-index funziona(anche se in realtà in questo caso funziona agendo su #imFooter)
Ora, il problema è che non so come comporre il codice per far si che agisca sullo specifico breakpoint...per capirci:
@media (min-width: 1920px) {
#imPageExtContainer { background-image: none; background-color: transparent; }
#imPage { padding-top: 0px; padding-bottom: 0px; min-width: 1920px; }
bla bla bla...............
}
@media (max-width: 1919px) and (min-width: 1680px) { bla bla bla
}
@media (max-width: 1679px) and (min-width: 1345px) { bla bla bla
}
@media (max-width: 1344px) and (min-width: 958px) { bla bla bla
}
@media (max-width: 957px) and (min-width: 768px) { bla bla bla
}
@media (max-width: 767px) and (min-width: 600px) { bla bla bla
}
@media (max-width: 599px) and (min-width: 480px) { bla bla bla
}
@media (max-width: 479px) { bla bla bla
}
Quello che vedo è che fanno tutti riferimento a "@media" e non sò il codice per poter far riferimento a quelle stringhe.
---E' evidente che non sono un tecnico, ma ci provo--------
Andrebbe meglio di tutto creare un codice univoco che agisca su tutte allo stesso modo...ma anche una per una va bene lo stesso purchè funzioni.
Spero di essere stato abbastanza utile allo scopo.
Ti ringrazio
Devi semplicemente dare un colore di sfondo o immagine allo "Sfondo del Footer" (#imFooterBg) in tutti i breakpoint impostati (Struttura del Modello).
Adesso lo sfondo del footer risulta trasparente da un certo breakpoint in giù ed è per questo che il CSS che hai utlizzato sembra che non "funzioni".
...!... però non vedo attuate le riparazioni che ti avevo consigliato, ...importantissime...!...
... azionando Ctrl+U puoi ispezionare il sorgente del codice e gli errori sono tra le righe nr. [10 > 66] ...da eliminare, e come detto prima, provare ad inserire in Oggetto Codice HTML, ...oppure a seconda dei risultati, nel pannello ESPERTO | Prima della chiusura del /BODY...
... poi, riferimento a quel rigo di media query si potrebbe intervenire, (oltre che da programma come già precedentemente indicato), anche con semplice codice globale o relativo ..
... nel caso, quando avrai riparato, fatti risentire...
.
Autore
Rieccomi!!!
Innanzitutto Vi ringrazio tantissimo per l'aiuto!!
Ho provveduto a correggere la disposizione dello scripto cosi come indicato da KolAsim, ma devo dire che la soluzione finale l'ha beccata lemonsong. Ho inserito l'immagine che volevo nel footer sullo sfondo del background, e da li ha funzionato con lo script di KolAsim!!
Grazie Mille Ragazzi