Nel sito sul www.thedomemilano.com non riesco a cliccare sui collegamenti che ci sono nelle pagine...dovrei usare la funzione z index ma il menu a destra è come se coprisse i link che ci sono nelle pagine. qualcuno sa come fare? grazie
Nel sito sul www.thedomemilano.com non riesco a cliccare sui collegamenti che ci sono nelle pagine...dovrei usare la funzione z index ma il menu a destra è come se coprisse i link che ci sono nelle pagine. qualcuno sa come fare? grazie
Ciao, in realtà sto affrontando una problematica simile anche io sempre per lo Z-Index, nel mio caso volevo fare appararire un tooltip in posizione TOP fuori dalla sezione in cui appariva, ma ho scoperto che non mi era possibile utilizzare la funzionalità Z-Index in concomitanza con il codice "overflow: hidden". Eliminando l'overflow, lo Z-Index funziona, ma purtroppo l'overflow hidden mi è necessario per una funzione specifica del mio sito. Ora non so se questo può centrare con il tuo problema, ma visto che mi è successo in questi giorni, te lo condivido.
Premetto: non condivido la scelta di sovrapporre gli elementi (soprattutto i testi) in quel modo, senza che abbiano delle aree ben definite e delimitate nel layout. Può essere una stravaganza artistica ma di certo non è una buona soluzione riguardo l'User Interface Design.
Loghi e testi dei menu, privi di background, che si mischiano ai testi dei contenuti, creano confusione nella lettura e nella navigazione del sito.
A prescindere da questo, c'è un problema dovuto ad una impostazione non proprio corretta degli elementi del layout.
Non è direttamente il menu a coprire i link nella pagina, ma è il suo contenitore e gli elementi elementor-column messi a riempire (in modo forse improprio) tale contenitore. Questo contenitore coi suoi elementi interni, si estende per l'intera larghezza restando in sovrapposizione rispetto ai contenuti, andando quindi ad intercettare e bloccare le azioni del mouse sui contenuti sottostanti.
In questo contenitore è presente sia il menu sia il logo.
E' chiaro che non puoi giocare con lo z-index, perché se lo imposti per portarsi ad un livello inferiore rispetto ai contenuti, allora il logo e il menu si porterebbero sotto i contenuti stessi e il problema si sposterebbe semplicemente su questa situazione.
Forse sarebbe più opportuno avere due contenitori distinti e dimensionati per ospitare rispettivamente il logo (a sinistra) e il menu (a destra), così da lasciare libero il centro dove scorrono i contenuti.
Prima di cercare soluzioni CSS per rattoppare il problema, è bene capire se puoi intervenire attraverso Elementor, dal momento che il layout è stato creato con questo. In tal caso prova ad impostare i due contenitori come indicato, dandogli la propria posizione e rimuovendo chiaramente quello che ti copre l'intera pagina.
Elementor è un ottimo plugin se usato con criterio.
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Visto che è stato aperto l'argomento Z-Index, scrivo qui, mi sto imbattendo in un problema simile utilizzando il seguente script che fa comparire delle tooltip quando fai mouse-over sul testo, il problema sorge quando devo inserire le tooltip, all'interno di questa sezione espandibile. Il problema sorge in quanto lo Z-Index del tooltip, pare non funzioni AL DI FUORI della sezione espandibile in quanto essa contiene il codice overflow: hidden; nel suo CSS. Io invece vorrei che il tooltip possa comparire anche fuori dalla sezione che lo contiene, in quanto mi è stato segnalato che con alcune risoluzioni o a finestra ridotta, il tooltip potrebbe non essere visibile correttamente come da SCREEN.
Se invece tolgo overflow: hidden, il codice della sezione espandibile si sminchia tutto, mostrando il contenuto che dovrebbe apparire solo al click sulla freccetta nera -> Screen
Come posso far in modo che il tooltip appaia sempre on TOP? Esiste qualche escamotage?
Ultima modifica di jeyjack; 05-03-2022 a 17:24
Inutile giocare con z-index se il tooltip si trova dentro specifici elementi e questi vanno a nascondersi o disporsi in modi imprevedibili; ci sono vari fattori che influenzano la sovrapposizione rispetto agli altri elementi della pagina e la il corretto posizionamento dentro i limiti della viewport.
Una possibile soluzione è quella di rendere indipendente il tooltip, cioè inserito come elemento a sé stante, magari appendendolo alla fine del body, e posizionato in modo fixed con un opportuno z-index; quindi gestirne la posizione attraverso JavaScript, in modo da "spostarlo" opportunamente sull'elemento di riferimento e mantenerlo sempre dentro i limiti dell'area visibile.
Al momento non ho né esempi né link da proporre, ma penso che nel tuo specifico caso, dove hai elementi che scompaiono e dove il contenuto stesso del tooltip può avere un ingombro importante, non è sufficiente il metodo solo CSS; non hai molte alternative se non gestire il tutto attraverso JavaScript.
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Ho capito, quindi l'unica soluzione e' attingere ad uno javascript, in termini di risultati credi si possano ottenere risultati soddisfacenti rispetto a quello che e' il tooltip attuale? Dovro' valutare se ne varra' la pena..Originariamente inviata da KillerWorm
Attualmente, nel tuo specifico caso e per le caratteristiche che richiedi, il solo CSS non consente di risolvere le problematiche da te riscontrate.l'unica soluzione e' attingere ad uno javascript
In particolare la questione relativa alla sovrapposizione del tooltip rispetto a tutti gli elementi della pagina, e la "correzione" della posizione quando il tooltip esce dall'area visibile.
Con JavaScript puoi risolvere quelle problematiche.in termini di risultati credi si possano ottenere risultati soddisfacenti rispetto a quello che e' il tooltip attuale?
Magari fai qualche ricerca del tipo "tooltip javascript", troverai moltissime soluzioni. Assicurati solo che soddisfino quelle caratteristiche.
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Rispondi quotando
