Menu fisso non fa funzionare alcuni link 
Author: Carmelo P.Buongiorno e...
Un grazie in anticipo, per chi come me è già al lavoro piuttosto che essere in vacanza e potrà darmi qualche suggerimento.
Seguendo un tutorial ho inserito il seguente codice "prima della chiusura del Tag HEAD" per ottenere il menu fisso sopra l'intestazione con questi rispettivi parametri dal "modello personalizzato", e fin qui tutto ok :
altezza menu: 54 allineato a dx
altezza intestazione: 54
altezza contenuto: 1000
altezza piè di pagina: 100
altezza sfondo piè di pagina: 100
Codice inserito nel Tag Head:
<style type="text/css">
#imHeaderBg {position: fixed; top: 0px; opacity:0.7; z-index: 50;}
#imHeader {position: fixed; top: 0px; width:100%; height:54px; opacity:0.7; z-index: 50; }
#imMnMn{position:fixed; top: 0px; left:auto;}
</style>
Il problema è che a quanto pare a causa del suddetto codice, non mi riesce di far funzionare alcuni link collegati a immagini o testi, inseriti sia nel piè di pagina che nell'intestazione.
Cosa ancor più strana, è che proprio nel piè di pagina non mi sia possibile inserire ulteriori link immagini oltre a quelle già collegate ai vari social.
C'è qualcuno che sa dirmi se sbaglio o se si tratta di un bug?
Author
... dimenticavo un riferimento indirizzo sito per verificare in particolare il link all'indirizzo email inserito nel piè di pagina: http://www.creativegallery.it
Attualmente pare che hai inserito un </div> (in più) alla fine del codice g+1
Pare eh...
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Io li vedo tutti funzionanti...
Se ho capito bene...
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Vero.....ahahaha
...?... come è stato inserito il MailTo ...?...
... è esterno al codice del FOOTER, ed avendo posizione assoluta si posiziona decentrato a destrra appena sotto al pulsante HOME, nascosto dallo SlideShow...!?...
... come mai...?...
... in base alla risposta, si potrebbe capire il da farsi...
.
ciao,
Non riesco a capirlo naenche io...?...a meno che non sia nascosto dall'oggetto html dei pulsanti sopra...
Author
....Svelato il mistero del piè di pagina, un grazie a quanti hanno colto il mio help :)))
Per quanto riguarda il footer era proprio il </div> in più ed ora è tutto ok!!!
Ma l'intestazione?...
Mi è sfuggito qualcos'altro? - Perchè secondo voi il logo in alto a dx non funziona?
E' semplicemente un link interno che riporta alla home ma credo che per la stessa ragione del footer, sia anche questo coperto o dal menu o dallo sfondo dell'intestazione.
Che ve ne pare, potete aiutarmi?
Author
...Scusate, intendevo dire il logo "a sx" mentre pensavo al menu allineato a dx che forse lo copre....
Prova ad alzarlo con il z-index..
hai messo tutto uno sull'altro e il menu copre l'header in cui hai il logo. Potresti stringere il menu a sx in modo di liberarlo, oppure metti il logo con oggetto html a livello superiore del menu (10001)
Author
In risposta a Mirko:
Ho provato con z-index 50 ma il link si attiva subito sotto al logo sovrapponendosi alla stessa altezza del percorso di pagina durante la navigazione.
Tra l'altro mentre riprovavo, ws ha ripreso a non aggiornare l'anteprima neanche con il tasto ctrl e pertanto non riesco neanche ad avere un riscontro reale di quello che sto facendo...
In risposta a Silver:
Potrebbe essere anche questa un'idea... ora vedo se esportando e reimportando il progetto riesco a ripristinare l'anteprima.
Riallacciandomi invece al problema precedente (chiamiamolo problema N.1) che credevo di aver risolto eliminando il doppio </div>, ho notato un fenomeno alquanto strano, ovvero: il link relativo all'invio email funziona ora su tutte le pagine mentre quello relativo alle condizioni d'uso (subito accanto) solo in Home page.
La cosa strana? E' che offline funzionano benissimo tutti e due!!! Eppure ho svuotato la cache e fatto un refresh dei file. Bah!
... quello che conta è quello che ottieni dalle verifiche in Esportazione DISCO ed in Esportazione RETE, e quest'ultimo è quello che conta per le nostre verifiche...
Author
Certo è strano che funzioni solo offline. Ma al problema riportato subito sopra ed a cui ho dato nome: N.1, potrei forse metterci una pezza impaginando il piè di pagina diversamente.
Nel frattempo per far prima ed evitare che l'anteprima di ws mi andasse in tilt, ho modificato il codice relativo allo z-index direttamente dalla pagina ma senza alcun esito.
Il link del logo mi si abbassa all'altezza del percorso di pagina e si sovrappongono i layer.
Proverò il consiglio di Silver e aggiornerò il post con i risultati - Grazie!
Author
Risultati relativi al problema N.2 (link logo che sovrapposto al menu e intestazione fissi non funziona)
(vedi home page: http://www.creativegallery.it)
E' proprio una questione di sovrapposizioni tra l'intestazione ed il menu a lato alla quale non so purtroppo porre rimedio.
Ho provato modificando i valori dello z-index "nel tag head" ed inserendo anche l'oggetto html nell'intestazione e, ripartendo da "0", questi sono i relativi codici che ho utilizzato
Nel Tag HEAD:
<style type="text/css">
#imHeaderBg {position: fixed; top: 0px; opacity:0.7; z-index: 50;}
#imHeader {position: fixed; top: 0px; width:100%; height:54px; opacity:0.7; z-index: 50; }
#imMnMn{position:fixed; top: 0px; left:auto; z-index: 50;}
</style>
Nell'oggetto HTML
<div style="position:fixed; top:7px; left:auto; z-index:10001">
<a href="http://www.creativegallery.it/index.html" target="_self" >
<img src="http://www.creativegallery.it/miologo.png"
width="258" height="38" align="center" border="0" ></div></a>
C'è qualcuno che sa dirmi eventualmente come modificare la larghezza del menu?
So che potrei porvi rimedio inserendolo direttamente nell'intestazione e cavandomela con un "onmouseover" sui pulsanti, ma la scelta non mi convince rispetto a come potrebbe essere indicizzato il sito.
Per curiosità, prova a mettere anche questo a 10001....
#imMnMn{position:fixed; top: 0px; left:auto; z-index: 50;}
Author
Grazie Mirko per la tua risposta ma purtroppo non funziona neanche questo parametro.
Ed è veramente strano...anche ad assegnare banalmente dei livelli in crescendo ex: 1,2,3,4
l'oggetto html con il link all'immagine resta comunque sovrapposto.
Veceversa, se abbasso gli altri per farlo funzionare, questi poi si sovrappongono non facendomi funzionare il menu.
Ho provato anche ad eliminare lo sfondo semitrasparente dell'intestazione, a dare il margine a sx del menu e a ridimensionarlo nel div ma non funziona neanche questo.
Non credevo mi complicasse così la situazione... mi arrendo!
Se l'argomento fosse già stato trattato sul forum e vi fosse qualche valida soluzione per risolvere il problema, sarà ben accetto.
Per il momento un grande ringraziamento ai guru di questo forum che ho seguito spesso con interesse anche in passato, ed un augurio a tutti per un fantastico 2014!!!
... grazie per gli auguri per l'anno nuovo, contraccambiati...
... comunque, io ci proverei con il famoso DIV CUSTOM by Icm...
... non posso essere preciso, non avendo programmi da due anni, ...ma proverei ad inserire nell'oggetto Codice HTML dell'Intestazione un qualcosa del genere, da personalizzare:
<div id="DIV_CUSTOM" style="position: absolute; top: 0px; left: 0px; width: 285px; height:50px;z-index:15000;"><a href="home.html"><img src="files/immagine.gif" width=285; height=50 title=HOME" alt="HOME" /></a> </div>
files/immagine.gif ...sarebbe l'immagine da allegare con un oggetto HTLL&WIDGETS | Esperto | ALLEGATI ...lasciando files come cartella destinataria...
immagine.gif ...può essere una qualsiasi immagine GIF da sostituire dopo l'assemblaggio con una immagine GIF TRASPARENTE (oppure PNP correggendo)...
... tutti i valori numerici, e riferimenti andrebbero personalizzati per un risultato ottimale..
... io ci proverei, il riscontro sarebbe immediato; ..sarei stato più diretto se avessi avuto il programma per provare personalmente...
.
ciao
Author
Grazie 1000!!! Più tardi tornerò all'attacco del suddetto codice anche se... con position: absolute "piuttosto che fixed", prima mi portava il logo al di sotto della posizione attuale.
Farò ancora un altro test - A presto!
Questo è un'esempio che avevo con il metodo di Kol...
http://provews.altervista.org/crisgrafica/
vedi che se allarghi o srtingi la finestra va a spasso.
ok...ora è a posto...tanks...
sicuro? per quello che serve a carmelo penso resti sotto il menu anche se alzi lo z-index
(ho riconosciuto il codice, lo scrissi io nel luglio 2010)
Può essere...non so dove lo ho trovato, ma me lo sono salvato visto che funzia beneeeee....
... a vederlo così, vedo che funziona bene, ...sarebbe da verificare il discorso del livello, se rimanesse sottostante al menu, ma col valore che avevo indicato credo che non dovrebbe accadere, ripeto credo, chi ha il programma può saperlo istantaneamente...
... il codice che ho usato io è sempre quello di Icm, messo inline per semplificare i suggerimenti, ...e che comunque sarebbe sempre questo stesso che segue:
::::::HEAD:::::
<style>
#DIV_CUSTOM {
position: absolute; top: 0px; left: 0px; width: 285px; height:50px;z-index:15000;
}
</style>
:::::BODY:::::(HEADER/Intestazione o altro contenitore)
<div id="DIV_CUSTOM">
<a href="home.html"><img src="files/immagine.gif" width=285; height=50 title=HOME" alt="HOME" /></a>
</div>
.
... in teoria dovrebbe funzionare, ma non posso verificare e dire di più, se non dalle prove di Mirko....
...
.
ciao
Eccomi.....
funzia
http://provews.altervista.org/kol/
... grazie Mirko, ...grande! ...e scusa se abuso, ...ma vedi se puoi provare ad abbassarlo di circa 100 pixel in modo da interferire col menu HOME e Pagina1, per capire se si posizioni SOPRA al MENU, oppure SOTTO, ...se vuoi, e tante grazie...
...ciao
Eccomi....sotto....
Quindi come lo si potrebbe risolvere il problema?
Proprio come ha scritto Kol più sopra ed ho provato io....
Ma l'immagine va sotto il menù, non va bene.
io lo vedo così
... sì, ...lo vedo sotto, ...ed ho notato che il problema dipende dal DIV contenitore del DIV_CUSTOM, che non ha ID per essere controllato, altrimenti funzionerebbe correttamente; ...sarebbe da chiedere ad Icm, se potesse farlo in un aggiornamento futuro...
... a questa stregua, non rimarrebbe che da fare un ultima prova, cioè usare il DIV_CUSTOM invece che in Intestazione, incollarlo in un Oggetto HTML&WIDGETS | HTML, cioè questo:
<div id="DIV_CUSTOM"><a href="http://www.google.it"><img src="files/logo.png" width=285; height=90 title=Google" alt="GOOGLE" /></a> </div>
... forse!! senza toccare lo style in HEAD così com'è adesso...
... ovviamente, tutto questo discorso, solo per non post-editare !!! altrimenti si otteneva da subito il risultato voluto...
.
ciao
E questo con logo sopra:
http://provews.altervista.org/kol2/
provato come hai scritto qui sopra e non funzia...ho solo cambiato il z-index nel secondo esempio...
prova a farlo scendere ancora e vedi che va sotto la pagina,
si dovrebbe anche provare con le impostazioni che sta usando Carmelo, con menu, intestazione e sfondo intestazione tutti fixed e top
io non trovo soluzione, o meglio, quella che ho trovato non funziona su chrome mentre sugli altri browser si
funziona invece se gli elementi non sono fixed
vediamo se passa qualcuno che trova dove sta il problema
qui il mio test
http://www.kesito.com/CG/
per quello che posso testare io funziona su
IE9
IE11
FF26
opera
safari
smartphon galaxy
invece non funziona su
chrome
kindle fire
smartphon huawey con android
NB: lavorando sulla grafica invece che sul codice probabilmente non ci sarebbe problema.
Su smartphon galaxy 3 no...non si vede il logo e messo in verticale il menu stà a dx in orizzontale invece il menu va tutto a sx....
Author
Ciao a tutti!
Mi fa piacere che l'argomento vi abbia appassionato e che a quanto pare non abbia dei precedenti su questo forum.
Vi aggiorno pertanto con gli ultimi test seguendo i vostri apprezzati consigli...
Nell'Head:
<style>
#DIV_CUSTOM {position: fixed; top: 7px; left: auto; px; width: 258px; height:38 ;px;z-index:1500000; }
</style>
Nell'intestazione:
<div style="position: fixed; top: 7px; left: auto; width: 258px; height: 38px; overflow: hidden;">
<div id="DIV_CUSTOM"><a href=http://www.creativegallery.it/index.html target="_self"><img src="http://www.creativegallery.it/files/logo creative.png" width=258; height=38 title=Home"alt="Home"/></a></div>
....sarebbe tutto ok (con il link sul logo funzionante) se non fosse che lo stesso livello logo, si sovrappone a tal punto da "opacizzare" il contenuto delle pagine oltre che il menu facendo scomparire anche il footer.
Ps. Il codice per il menù e l'header fissi arrivano da qui:
http://www.essedi.altervista.org/_EVO10/_menufisso/index.html
...Il problema è che con questo tipo di allineamento del menu a dx con header fisso, non so nemmeno a quanto possa servire inserire il logo nello sfondo immagine del menu stesso.
Proverò anche questa strada.
A meno che nel menu principale, non vi sia la possibilità di personalizzare il primo pulsante a sx per inserirvi il logo.
A presto!
x
, ...Kol2 funziona sul mio CH ed FF, ma non su IE.7 (che conta poco), quindi direi risultato ottenuto per me; ...dovresti provare a fare, se te la senti, l'ultima prova che avevo proposto, cioè mettere il DIV_CUSTOM in oggeto HTML della pagina, ovviamente si dovranno rivedere tutte le coordinate usate, essendo il punto "zero" riferito al'oggetto contenitore...
x
, ... interessante soluzione, ...funziona sul mio FF, ma non su CH e nè su IE.7 (che conta poco); ... mi riprometto di approfondire se e quando potrò...
.
.
ciao
Visto che sono stato tirato in ballo, questa è la mia soluzione per l'header:
http://www.essedi.altervista.org/_EVO10/_logo/index.html
(a discussione chiusa, il sito sarà cancellato).
Queste le istruzioni (sperando che Answer non le stravolga)
Impostazioni Generali, Scheda Esperto, Prima della chiusura del tag HEAD
<style type="text/css">
#imHeaderBg {position: fixed; top: 0px; height:54px; opacity:0.7; z-index: 50;}
#imHeader {position: fixed; top: 0px; width:100%; height:54px; opacity:0.7; z-index: 50; }
#imMnMn{position:fixed; top: 0px; left:auto;}
#imContentGraphics {top: 0;}
#logo {position:fixed; top: 0px; left: 50%; margin-left: -480px; width:280px; height: 54px; background-image: url("files/logo.png"); z-index: 10001;}
</style>
Impostazioni Generali, Scheda Esperto, Prima della chiusura del tag BODY
<a id="logo" href="index.html"> </a>
Con altri codici ma funzia uguale al mio
http://provews.altervista.org/logo/
mi sembra....
Ma sia il mio che quello di EsseDi con galaxy in orizzontale, sballa tutto...
Author
....Grandi!!! - Evidentemente il post di Silver si era sovrapposto al mio e non ho avuto il tempo di testarlo....Ci provo e magari, per quanto riguarda la compatibilità con gli smartphone, inserisco un redirect di questo tipo:
<script type="text/javascript" src="http://www.tuosito.it/javascript.js"></script><script type="text/javascript">var deviceWap = 'deviceWap';var deviceWml = 'deviceWml';if(getQueryString('redirect') != 'no' && DetectMobileLong()) document.location = 'http://tuosito.it/mobile/index.html' </script>
...Che funziona, è free e di cui allego anche lo script per chi lo volesse utilizzare.
Provato in tutti i modi, con tutte le varie misure e z-index, ma non appare il logo....
Non ci posso credere... funzia con tutto, anche mobile....
http://provews.altervista.org/logo2
e la finestra stà volta non va a spasso....ahahaha...
Author
In allegato il risultato ottenuto con il test di silver al seguente link: http://www.kesito.com/CG/ che, malgrado sembrerebbe funzionare non modificando la posizione del logo con il ridimensionamento della finestra del browser (almeno con IE11) genera purtroppo la sovrapposizione visibile nell'immagine.
...Vi aggiornerò - Grazie!!!
...
...ha colto nel segno, complimenti, ...funziona su tutti i miei, compreso IE.7 (affezionatissimo)...
...
... kol2 e logo2, ...OK su CH ed FF
...
... ...su di altri dispositivi non posso testare, non facendone uso...
...
... grazie a tutti per il coinvolgimento e partecipazione dimostrata, anche a
che ne ha sollevato l'interesse...
...
Author
...Modificato z-index da 1 a 50 come segue:
#imHeaderBg {position: fixed;z-index:50;} e sembrerebbe tutto ok con la soluzione di Mirko!!!! woowww! grazie, grazieeee
...un felice anno a tutti e alla prox, con l'augurio di poter contraccambiare la vostra disponibilità.
Auguri!