Unofficial WebSite X5

Area JS => Discussioni Generali => Topic aperto da: marcoboni - 02 Gennaio, 2012, 18:31:11

Titolo: Mega menu
Inserito da: marcoboni - 02 Gennaio, 2012, 18:31:11
Ciao Ragazzi, (complimenti per il forum) vorrei inserire nel mio sito un mega menu sapreste indicarmi un tutorial o qualche programmatore che lo vende già fatto. >:D  grazie!
Titolo: Re:Mega menu
Inserito da: granita - 05 Gennaio, 2012, 20:16:18
che cos'è un MEGAMENU?  ::)
Titolo: Re:Mega menu
Inserito da: serzio - 05 Gennaio, 2012, 20:46:20
che cos'è un MEGAMENU?  ::)


Forse qualcosa del genere?

http://www.geektantra.com/projects/jquery-megamenu/

http://www.geektantra.com/2009/09/jquery-mega-menu/
Titolo: Re:Mega menu
Inserito da: tigrone - 05 Gennaio, 2012, 23:37:35
che cos'è un MEGAMENU?  ::)
A dire il vero me l'ero chiesto anch'io... boh......  ???
Titolo: Re:Mega menu
Inserito da: granita - 06 Gennaio, 2012, 07:45:36
capito, grazie,  non sapevo si chiamasse MEGAMENU.
Alcuni sono belli davvero.http://www.yourinspirationweb.com/2011/09/26/come-realizzare-un-megamenu-efficace-e-accattivante-ispirazione-e-risorsa-free/ (http://www.yourinspirationweb.com/2011/09/26/come-realizzare-un-megamenu-efficace-e-accattivante-ispirazione-e-risorsa-free/)
Titolo: Re:Mega menu
Inserito da: marcoboni - 06 Gennaio, 2012, 10:54:51
 :D  gli script sono quelli che cercavo appena ho 2 minuti di tempo provo a metterli nel mio sito.........grazie!
Sarebbe bello che un giorno si riuscisse a fare con il menu principale di Website.
Titolo: Re:Mega menu
Inserito da: marcoboni - 02 Marzo, 2012, 11:00:04
 :D rieccoci con il mega mega menu ;)
Dunque ho trovato questo che è perfetto per il lavoro che voglio fare.......mah!! mi finisce sotto la slide centrale ???  qualcuno sa come posso aggirare l'ostacolo? mi va bene anche modificare html dell'index.........ma devo riuscire a fare questo menu altrimenti mi vedo costretto ad abbandonare website, per un cms ma non ho il tempo materiale per rifare tutto il sito :-\ .......................
esempio: http://www.egimotors.it/aatest/ (http://www.egimotors.it/aatest/)
come sempre Grazie!
Titolo: Re:Mega menu
Inserito da: tigrone - 02 Marzo, 2012, 12:35:58
.........ma devo riuscire a fare questo menu altrimenti mi vedo costretto ad abbandonare website, per un cms ma non ho il tempo materiale per rifare tutto il sito :-\ .......................


Per così poco? ???


Prova ad aumentare l'altezza dell'oggetto...
Titolo: Re:Mega menu
Inserito da: Silver - 02 Marzo, 2012, 13:28:57
:D rieccoci con il mega mega menu ;)
Dunque ho trovato questo che è perfetto per il lavoro che voglio fare.......mah!! mi finisce sotto la slide centrale ???  qualcuno sa come posso aggirare l'ostacolo? mi va bene anche modificare html dell'index.........ma devo riuscire a fare questo menu altrimenti mi vedo costretto ad abbandonare website, per un cms ma non ho il tempo materiale per rifare tutto il sito :-\ .......................
esempio: http://www.egimotors.it/aatest/ (http://www.egimotors.it/aatest/)
come sempre Grazie!



non va messo in un oggetto html ma in un div dopo /body.
Titolo: Re:Mega menu
Inserito da: marcoboni - 02 Marzo, 2012, 14:52:31
Ciao Tigrone, alzando l'oggetto funziona, ma non va bene perchè a menu chiuso  rimane dello spazo vuoto................. ho inserito un div ma il menu finisce ancora sotto la gallery.......provo a smanettare il div della gallery
 
Grazie!
Titolo: Re:Mega menu
Inserito da: Silver - 02 Marzo, 2012, 15:41:07
non riesco a postare codice sul forum, mi mangia tutte le chiusure...
ti allego un esempio da sistemare, va messo nelle -->proprietà della pagina -->sezione esperto--> dopo /body
[attachurl=1]
Titolo: Re:Mega menu
Inserito da: tigrone - 03 Marzo, 2012, 00:26:57
Ciao Tigrone, alzando l'oggetto funziona, ma non va bene perchè a menu chiuso  rimane dello spazo vuoto................. ho inserito un div ma il menu finisce ancora sotto la gallery.......provo a smanettare il div della gallery
 
Grazie!
E' il solito problema assurdo della griglia di website...


Pazzesco pensare che ci vogliono 2 secondi per scrivere semplicissimi codici a mano e farsi un layout perfetto!


E un programma dovrebbe facilitare la vita... invece la COMPLICA!
Imparate l'html!!!!!!! ::)
Titolo: Re:Mega menu
Inserito da: marcoboni - 03 Marzo, 2012, 09:18:22
Hai ragione Tigrone, ma il tempo in azienda è sempre poco, ........ >:D
Ho provato con il div che mi ha data Silver
 
Codice:
Only registered users can see contents. Please click here to Register or Login.e funziona http://www.egimotors.it/aatest/ (http://www.egimotors.it/aatest/)
una cosa sola però posso sostituire top: 5 px ; con una percentulate tipo top:10%;   in modo che la posizione sia sempre fissa in percentuale indipendentemente dalla risoluzione video, corretto?
Se a qualcuno interessa linko qui http://www.egimotors.it/demo_mega_menu.zip (http://www.egimotors.it/demo_mega_menu.zip)    una demo del menu che sto cercando pubblicare nel mio sito.
 ;)
Titolo: Re:Mega menu
Inserito da: milux - 03 Marzo, 2012, 09:47:13
perdona la domanda banale, ma perchè non sostituisci il "mega menù" al menù orizzontale di wsx5, lasciando il tutto in alto?
Titolo: Re:Mega menu
Inserito da: marcoboni - 03 Marzo, 2012, 10:06:42
Citazione
perdona la domanda banale, ma perchè non sostituisci il "mega menù" al menù orizzontale di wsx5, lasciando il tutto in alto?
Domanda per nulla banale, voglio mantenere il menu in alto orginale di websitex5 per le pagine "istituzionali", e avere un menu di "impatto" per i prodotti e le aziende che rappresentiamo, in pratica il layout sarà:
menu websutex5---> home/contatti/ecc
Header---> con logo principale della nostra azienda + loghi delle società da noi rappresentate
megamenu--> fuoristarda/moto/motoslitte/veicoli ele1 /veicoli ele2
 ;)
Titolo: Re:Mega menu
Inserito da: milux - 03 Marzo, 2012, 11:02:37
hai provato a invertire i ruoli?


Megamenù
------------------
Header
-----------------
Menù


dico questo perchè il Megamenù mi sembra troppo di impatto sotto l'header..
Titolo: Re:Mega menu
Inserito da: stesil - 03 Marzo, 2012, 15:41:55

una cosa sola però posso sostituire top: 5 px ; con una percentulate tipo top:10%;   in modo che la posizione sia sempre fissa in percentuale indipendentemente dalla risoluzione video, corretto?


Secondo me per come hai posizionato il div nella pagina, se cambi il valore di top in % la posizione del menu cambia in funzione della lunghezza della pagina. Il div è contenuto in imHeader con position static e quindi la percentuale dovrebbe essere calcolata rispetto al valore dell'altezza di imPage che ha position relative.
Mi posso sbagliare, ma se provi ad allungare la pagina con più contenuti mettendo il valore in % lo verifichi facilmente.
Titolo: Re:Mega menu
Inserito da: marcoboni - 05 Marzo, 2012, 08:54:37
Ciao Stesil
Citazione
Secondo me per come hai posizionato il div nella pagina, se cambi il valore di top in % la posizione del menu cambia in funzione della lunghezza della pagina. Il div è contenuto in imHeader con position static e quindi la percentuale dovrebbe essere calcolata rispetto al valore dell'altezza di imPage che ha position relative.
Mi posso sbagliare, ma se provi ad allungare la pagina con più contenuti mettendo il valore in % lo verifichi facilmente.

Ho inserito del testo allungando la pagina e sembra che la posizione non cambi (http://www.egimotors.it/aatest)..........mah! mentre applicavo le  modifiche a una copia del sito "vero (http://www.egbimotors.it/aatest/esempio.jpg)"
mi sono resoconto di aver tralasciato la cosa più importante, ....... il menu si deve vedere in tutte le pagine e quindi devo per forza fare in modo che modificando una pagina poi me lo ritrovo in tutte, quando usavo Dreamweaver c'era la pagina master ma con website non so come funziona e l'ho chiesto al sito di supporto ufficiale.
Titolo: Re:Mega menu
Inserito da: Silver - 05 Marzo, 2012, 09:24:57
il valore 5px che ho messo casualmente lo cambi con quello che ti fa più comodo ma come dice stesil, non in percentuale, il valore indica la distanza superiore.
per mettere il megamenu in tutte le pagine la via più semplice è mettere il codice che ti ho dato nel box delle attivazioni statistiche al passo 1 sezione esperto.

Titolo: Re:Mega menu
Inserito da: marcoboni - 05 Marzo, 2012, 09:42:04
Scusate :-\   ha ragione Stesil , se metti il valore in percentuale e allunghi la pagina cabia anche la posizione del menu......hoi fatto il test sul sito sbagliato... :o
Titolo: Re:Mega menu
Inserito da: marcoboni - 05 Marzo, 2012, 10:05:29
il valore 5px che ho messo casualmente lo cambi con quello che ti fa più comodo ma come dice stesil, non in percentuale, il valore indica la distanza superiore.
per mettere il megamenu in tutte le pagine la via più semplice è mettere il codice che ti ho dato nel box delle attivazioni statistiche al passo 1 sezione esperto.
Bene ho messo 105px da top, inserendo il tutto nel codice box attivazione statistiche  e lo ritrovo in  tutte le pagine.......a lavoro finito posto tutto grazie!
Titolo: Re:Mega menu
Inserito da: marcoboni - 27 Marzo, 2012, 09:52:31
Rieccomi.. >:D  ho quasi pronto il "mio" mega menu http://www.egimotors.it/aatest/ (http://www.egimotors.it/aatest/)  problema!
Non funziona con tutti i Browser..... Con fire fox funziona ma i link sotto tipo quelli del video goupil non lo riconosce.... con ie funziona il link video ma non funziona il menu...... :-X  che faccio ? abbandono?
Titolo: Re:Mega menu
Inserito da: Silver - 27 Marzo, 2012, 11:18:09
hai messo al div che contiene il mega menu width e height a 100%, in questo modo ti copre l'intera pagina,
prova a mettere le misure in px che effettivamente servono, direi piu o meno 1100 x 350.
Titolo: Re:Mega menu
Inserito da: marcoboni - 28 Marzo, 2012, 10:12:18
hai messo al div che contiene il mega menu width e height a 100%, in questo modo ti copre l'intera pagina,
prova a mettere le misure in px che effettivamente servono, direi piu o meno 1100 x 350.

Hai perfettamente ragione http://www.egimotors.it/aatest/ (http://www.egimotors.it/aatest/) adesso i link funzionano.....ultimo problemino è che con ie in locale funziona ma online no ???  mentre fire fox tutto ok sia in locale che online.
Titolo: Re:Mega menu
Inserito da: milux - 28 Marzo, 2012, 10:32:09
Però in tutti e tre i casi (browser) il menù viene visualizzato sfalsato..


[attach=1]
Titolo: Re:Mega menu
Inserito da: Silver - 28 Marzo, 2012, 10:48:18
io lo vedo funzionante su tutti e tre i browser,
piuttosto come ti fa notare milux devi centrare il div, ora hai messo 11% ma chiaramente è diverso da risoluzione a risoluzione.
Titolo: Re:Mega menu
Inserito da: marcoboni - 28 Marzo, 2012, 11:09:10
UHMM ???  grazie per il test , ora lo metto a 150px e non 11% e vedo se va bene........per ilo momento GRAZIE!!
Titolo: Re:Mega menu
Inserito da: Silver - 11 Aprile, 2012, 12:45:38
UHMM ???  grazie per il test , ora lo metto a 150px e non 11% e vedo se va bene........per ilo momento GRAZIE!!


sempre sfalsato resta, a messo al centro non a una misura specifica.
Titolo: Re:Mega menu
Inserito da: marcoboni - 23 Aprile, 2012, 15:07:39
UHMM ???  grazie per il test , ora lo metto a 150px e non 11% e vedo se va bene........per ilo momento GRAZIE!!



sempre sfalsato resta, a messo al centro non a una misura specifica.

Ciao Silver, grazie per aver visto il problema......mah ::)  non risco propio ad "ancorare" il menu al contenuto della pagina in centro.....
www.egimotors.it (http://www.egimotors.it)
Titolo: Re:Mega menu
Inserito da: stesil - 23 Aprile, 2012, 20:31:00
Il menu non si riesce a centrare perchè il valore di left è riferito alla finestra del browser ... il div che contiene il menu è posizionato in modo assoluto ed è esterno al box contenitore imPage. Quindi o riposizioni tutto il div in header (se non ricordo male in una prova precedente lo avevi messo in quella posizione) e così centri il menu facilmente, oppure occorre trovare un modo per assegnare il valore di left "giusto" in funzione della larghezza del monitor ..

Puoi provare questo js, che ho usato in diverse occasioni ... ma ti devo dire che non ho avuto il tempo di riprodurre il tuo progetto e di provare se può andar bene anche in questa situazione.

In head:
<script type="text/javascript">
$(document).ready(function (){
margine();
});
$(window).resize(function () {
margine();
});
function margine(){
var x=$(window).width();
var lx = (x > 1120) ? ((x-1120)/2):0;
$("div#miomenu").css('left', lx);
};
</script>

Il valore in rosso è la larghezza del menu .... o forse è meglio considerare la larghezza del sito. Occorre anche aggiungere un id="miomenu" al div che contiene il menu.

Poi magari qualcun altro trova una soluzione più semplice ancora....
Titolo: Re:Mega menu
Inserito da: lemonsong - 23 Aprile, 2012, 22:56:53
Citazione
http://www.egimotors.it/aatest/

Perdonate l'intrusione e la grossa cavolata che scriverò...  :-\ ho provato solo con FF (Firebug).

Se questo frammento di codice viene modificato così?

Codice:
Only registered users can see contents. Please click here to Register or Login.
La modifica e aggiunta:

left: 50%;
margin-left: -560px;

Si centra a varie risoluzioni e con i vari browser?
Mah... portate pazienza, il mio cervello va in loop  :)

Titolo: Re:Mega menu
Inserito da: lemonsong - 24 Aprile, 2012, 10:07:24
Si centra a varie risoluzioni e con i vari browser?

OK, mi rispondo da solo  :)
Ho visto che con risoluzione inferiore a 1120px, ovviamente non funge.
Superiore a 1120px dovrebbe essere OK.

Domanda: se non ricordo male con la 8 si riusciva in qualche modo ad "uscire" dall'header con codice HTML, con la 9 non si può?

P.S.
@marcoboni
Qui (attualmente), se stai facendo delle prove,  ti sei dimenticato l'unità di misura (%):
http://www.egimotors.it/ (http://www.egimotors.it/)

<!--codice inserito da marco-->
<div style=" z-index:1000; position: absolute; top: 105px;  width:1100px; height: 35px; left: 50; margin-left:-560px;">



Titolo: Re:Mega menu
Inserito da: marcoboni - 24 Aprile, 2012, 10:43:08
 :) Grazie, Lemon per tutto, ;) ho optato per la soluzione di Stesil e sembra funzionare.
Ho messo in head
Codice:
Only registered users can see contents. Please click here to Register or Login.nel div
Codice:
Only registered users can see contents. Please click here to Register or Login.Ho fatto varie prove e sembra tutto ok, il problema più grossi li avevo con il Safari+MAc del mio collega ma adesso lo vede bene anche lui.
Grazie, Stesil e Lemon :D
 
 
Titolo: Re:Mega menu
Inserito da: stesil - 24 Aprile, 2012, 15:26:07
@Lemon
La tua è una bella idea ... non ci avevo mai pensato! Ho posizionato anche elementi più piccoli sempre via js ... invece in questi casi il tuo css è un'ottima soluzione!


Domanda: se non ricordo male con la 8 si riusciva in qualche modo ad "uscire" dall'header con codice HTML, con la 9 non si può?

Il problema del codice html inserito in header nella 9 è che viene avvolto da un div con overflow: hidden ... e per toglierlo occorre agire ancora via js o con un post-edit.
Titolo: Re:Mega menu
Inserito da: lemonsong - 24 Aprile, 2012, 16:11:35
[...] non ci avevo mai pensato!
Non ci credo  :)

Il problema del codice html inserito in header nella 9 è che viene avvolto da un div con overflow: hidden ... e per toglierlo occorre agire ancora via js o con un post-edit.

Anche nella 8 è così (div con overflow: hidden), sicuramente ricordavo male, grazie.

@marcoboni
Prego, ha fatto tutto Silvana  :)
Titolo: Re:Mega menu
Inserito da: StratoS - 24 Aprile, 2012, 17:30:24
Anche nella 8 è così (div con overflow: hidden), sicuramente ricordavo male, grazie.
Non ricordi male.
Uno dei primi Topic che ho aperto nel "coso" era proprio in fulzione al posizionamento degli oggetti oltre il top che con la 8, ricordo benissimo,si poteva fare ora, non so per quale strano motivo, dopo essere passato alla 9, anche con la 8 non ci si riesce più... ???
Non sarà sicuramente così, ma non è che con l'installazione della 9 si va a modificare anche qualcosa della 8 :o
Sicuramente ho detto una castroneria, ma io ricordo benissimo, perchè ho ancora siti che girano con oggetti fuori il top ed addirittura a fianco i pulsanti del menù, cosa che ora non si può più fare, se non con il sistema da te indicato.
Ciao.
Augusto.
Titolo: Re:Mega menu
Inserito da: marcoboni - 26 Aprile, 2012, 10:28:38
 ??? ..problemino... con IE 7 il mouse over del menu non funziona  >:D ....
Titolo: Re:Mega menu
Inserito da: stesil - 26 Aprile, 2012, 19:51:55
Non so se funzionerà e non ho ancora capito come IE7 calcola le relazioni tra gli elementi con position absolute ... ma prova questa modifica ...

Citazione
<div id="miomenu" style="position:absolute; z-index:10000; top:105px; height:35px; left:0;">

poi nel file menu.css, #menu:

margin: 30px 0px 0px;
Titolo: Re:Mega menu
Inserito da: lemonsong - 26 Aprile, 2012, 20:46:10
Sì, aumentando z-index dovrebbe fungere e credo che sia dovuto dal CSS di questo commento condizionale:

Codice:
Only registered users can see contents. Please click here to Register or Login.
http://www.egimotors.it/style/ie.css

#imPage{z-index:9000;}


Sicuramente fungerà anche la modifica a margin, comunque se dichiariamo la larghezza nel CSS in linea dovrebbe fungere ugualmente:

Citazione
<div id="miomenu" style="position:absolute; z-index:10000; width: 1120px; top:105px; height:35px; left:0;">


Scusami stesil se ho aggiunto 'sto post superfluo  :)
Titolo: Re:Mega menu
Inserito da: stesil - 26 Aprile, 2012, 22:01:20
Scusami stesil se ho aggiunto 'sto post superfluo  :)
 
... superfluo? Non credo proprio! :D

Hai ragione tu ... IE7 è strano, è vero, ma io il css nel commento condizionale non l'avevo visto!
Titolo: Re:Mega menu
Inserito da: marcoboni - 27 Aprile, 2012, 12:30:21
Dunque ho modificcato cosi
Codice:
Only registered users can see contents. Please click here to Register or Login.e provato in locale ma mi crea problemi con il menu prencipale di evo ( immagine allegata)(http://www.egimotors.it/problema.png)
.......mi viene voglia di....... ma saranno in tanti ad usare IE dalla 8 in giù? :-\
Titolo: Re:Mega menu
Inserito da: milux - 27 Aprile, 2012, 12:40:23

.......mi viene voglia di....... ma saranno in tanti ad usare IE dalla 8 in giù? :-\



http://www.w3schools.com/browsers/browsers_explorer.asp (http://www.w3schools.com/browsers/browsers_explorer.asp)
Titolo: Re:Mega menu
Inserito da: stesil - 27 Aprile, 2012, 12:54:58
Dunque ho modificcato cosi
Codice:
Only registered users can see contents. Please click here to Register or Login.e provato in e provato in locale ma mi crea problemi con il menu prencipale di evo

Sì, il valore di z-index che ho scritto è ... esagerato!
 
 9001 dovrebbe bastare e non creare interferenze con il menu di Evo.
Titolo: Re:Mega menu
Inserito da: marcoboni - 27 Aprile, 2012, 21:49:57
Dunque ho modificcato cosi
Codice:
Only registered users can see contents. Please click here to Register or Login.e provato in e provato in locale ma mi crea problemi con il menu prencipale di evo

Sì, il valore di z-index che ho scritto è ... esagerato!
 
 9001 dovrebbe bastare e non creare interferenze con il menu di Evo.
Ho modificato mettendo 9005 ...... e non "cozza" più con evo....  me sembra che il problema con IE7 rimanga ???

ps: lemon e stesil,,,,, grazie!!
Titolo: Re:Mega menu
Inserito da: lemonsong - 27 Aprile, 2012, 22:49:20
Eh sì, purtroppo ieri non ho verificato il menu a comparsa (se ti riferisci a quello).
Non ho la 9 per fare delle prove "sul campo", ma sono sicuro che stesil riuscirà anche questa volta a darti una mano  ;)
Forse è più "semplice" inserire il mega menu nell'header con un po' di JS?

Se nelle tue statistiche del sito vedi che le visite con IE7 sono "relativamente poche" puoi reindirizzare i visitatori ad una pagina dove consigli di aggiornarsi.

Mi spiace non poter fare di più.
Titolo: Re:Mega menu
Inserito da: stesil - 28 Aprile, 2012, 01:01:07
Non ho soluzioni da dare ... e non ne vedo altre rispetto a quelle prospettate da lemon.

Scrivo comunque quello che ho trovato, cioè la causa del comportamento anomalo dei menu in IE7 .... chissà che a qualcuno non venga qualche idea ...

http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html

guardando la pagina con ff e poi con ie7 si vede la differenza. Il box giallo è l'analogo del div che contiene il menu di evo (z-index:10000), inserito in un div contenitore (imPage) con position relative e z-index 9000, quello verde si comporta come il box con il mega menu (z-index:9001).

Il valore di z-index del menu di evo, a quanto ho capito, viene interpretato da ie7 solo rispetto agli elementi che fanno parte dello stesso contenitore, quindi agli elementi contenuti in imPage.

E per dargli una priorità rispetto al mega menu si dovrebbe aumentare il valore di z-index di imPage ... ma così il mega menu diventa non cliccabile ... e torniamo al punto di partenza.

Se invece il mega menu fosse inserito anch'esso in imPage ... allora i valori di z-index sarebbero rispettati. E se posizionarlo diversamente da programma risulta poco agevole, si può pure provare la strada dello spostamento del codice con js, come suggerito da lemon.


Titolo: Re:Mega menu
Inserito da: marcoboni - 28 Aprile, 2012, 08:56:02
Eh sì, purtroppo ieri non ho verificato il menu a comparsa (se ti riferisci a quello).
Non ho la 9 per fare delle prove "sul campo", ma sono sicuro che stesil riuscirà anche questa volta a darti una mano  ;)
Forse è più "semplice" inserire il mega menu nell'header con un po' di JS?

Se nelle tue statistiche del sito vedi che le visite con IE7 sono "relativamente poche" puoi reindirizzare i visitatori ad una pagina dove consigli di aggiornarsi.

Mi spiace non poter fare di più.
.....in effetti avevo già controllato le statistiche del sito per capire in quanti utilizzano IE7 ma se non sbaglio google da solo il tipo di browser e non la vesione usata...... da un sito che mi ha girato @Milux sembra che tra i vari IE in sevizio il 2.5% siano la vesione 7.
Ad un nostro cliente ho già consigliato di installare l'aggiornamento alla 8 o un'altro browser ........però onestamente mi scoccia un poò forzare l'utente a cabiare il browser.
e... come sempre tnkx :D
Titolo: Re:Mega menu
Inserito da: marcoboni - 28 Aprile, 2012, 09:05:19
Non ho soluzioni da dare ... e non ne vedo altre rispetto a quelle prospettate da lemon.

Scrivo comunque quello che ho trovato, cioè la causa del comportamento anomalo dei menu in IE7 .... chissà che a qualcuno non venga qualche idea ...

http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html (http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html)

guardando la pagina con ff e poi con ie7 si vede la differenza. Il box giallo è l'analogo del div che contiene il menu di evo (z-index:10000), inserito in un div contenitore (imPage) con position relative e z-index 9000, quello verde si comporta come il box con il mega menu (z-index:9001).

Il valore di z-index del menu di evo, a quanto ho capito, viene interpretato da ie7 solo rispetto agli elementi che fanno parte dello stesso contenitore, quindi agli elementi contenuti in imPage.

E per dargli una priorità rispetto al mega menu si dovrebbe aumentare il valore di z-index di imPage ... ma così il mega menu diventa non cliccabile ... e torniamo al punto di partenza.

Se invece il mega menu fosse inserito anch'esso in imPage ... allora i valori di z-index sarebbero rispettati. E se posizionarlo diversamente da programma risulta poco agevole, si può pure provare la strada dello spostamento del codice con js, come suggerito da lemon.

..... ::) più o meno penso di aver capito quello che mi avete detto, adesso sono incasinato con altri 2 siti uno da finire l'altro parte da zero ...appena ho un pò di tregua farò delle prove.
Grazie!
Titolo: Re:Mega menu
Inserito da: lemonsong - 28 Aprile, 2012, 13:34:09
.....in effetti avevo già controllato le statistiche del sito per capire in quanti utilizzano IE7 ma se non sbaglio google da solo il tipo di browser e non la vesione usata......

Se ti riferisci a Google Analytics hai pure le versioni:

[attachimg=1]
Titolo: Re:Mega menu
Inserito da: stesil - 29 Aprile, 2012, 11:23:14
Forse adesso ci siamo :)

http://stesil.altervista.org/evo9/megamenu/ (http://stesil.altervista.org/evo9/megamenu/)

Ho inserito il mega menu in header con codice html in modifica del modello.

In head queste due righe di jquery, per correggere il valore di overflow del div che crea automaticamente evo9 ed aggiungere il giusto valore di z-index:

Codice:
Only registered users can see contents. Please click here to Register or Login.
Togli lo script js per centrare il menu ... non serve più.

Ciao

Edit: riattivato link
Titolo: Re:Mega menu
Inserito da: marcoboni - 30 Aprile, 2012, 08:54:56
.....in effetti avevo già controllato le statistiche del sito per capire in quanti utilizzano IE7 ma se non sbaglio google da solo il tipo di browser e non la vesione usata......


Se ti riferisci a Google Analytics hai pure le versioni:

(Attachment Link)

....infatti tanto per cambiare hai ragione ;)  ho controllato e direi che vale la pena di mettere mano al codice adesso provo la soluzione di @stesil(http://www.egimotors.it/ie7.png)
Titolo: Re:Mega menu
Inserito da: marcoboni - 30 Aprile, 2012, 11:56:26
Forse adesso ci siamo :)

http://stesil.altervista.org/evo9/megamenu/ (http://stesil.altervista.org/evo9/megamenu/)


Ho inserito il mega menu in header con codice html in modifica del modello.

In head queste due righe di jquery, per correggere il valore di overflow del div che crea automaticamente evo9 ed aggiungere il giusto valore di z-index:

Codice:
Only registered users can see contents. Please click here to Register or Login.
Togli lo script js per centrare il menu ... non serve più.

Ciao

GRAZIE!  ho provato con IE tester...... e sembra tutto ok.  penso propio che ho finito di romperti l'anima......  :))
Titolo: Re:Mega menu
Inserito da: stesil - 30 Aprile, 2012, 12:23:58
Prego!
... e non ti preoccupare ... nessuna rottura! :)
Titolo: Re:Mega menu
Inserito da: marcoboni - 30 Aprile, 2012, 15:14:00
Prego!
... e non ti preoccupare ... nessuna rottura! :)
eehhh dai che un pò ho rotto ;D .... spero che tutto questo lavoro torni utile al forum ;)
Titolo: Re:Mega menu
Inserito da: Topografo - 04 Marzo, 2014, 10:21:42
Hummm, ho provato ad implementarlo, anche copiando spudoratamente il codice di Marcoboni e di Stesil ma mi viene un patatracchio...
Intuisco che c'entri qualcosa il file 
Citazione
csshover3.htc

Ma solo con IE6... devo includerlo?

e credo che anche che il menu.css vada modificato... o sbaglio? Ma come?

Partiamo da:
Citazione
      <!--[if IE 6]>
       <style>
       body {behavior: url("files/csshover3.htc");}
       #menu li .drop {background:url("files/drop.gif") no-repeat right 8px;
       </style>
       <![endif]-->
       <script type="">
       $(document).ready(function(){
       $('ul#menu').parent('div').css({
       'overflow':'visible',
       'z-index':'9001'
       });
       });
       </script>



Quì abbiamo un file drop.gif e
csshover3.htc ... devo includerli? Da un Widget? In Home Page?

Poi passiamo al codice della pagina...
Parto da
[/size]
[/pre]
Citazione
<div style=" z-index:1000; position: absolute; top: 200px;  width:100%; height: 100%;">
<ul id="menu">
                  
                <li><a href="#" class="drop">UTV FUORISTRADA</a><!-- Begin 4 columns Item -->
                  
                       <div class="dropdown_4columns"><!-- Begin 4 columns container -->
                      
                           <div class="col_4">

                              
                              <img alt="" src="img/logo_polaris.gif" /></div>
                          
                           <div class="col_1">
                          
                               <h3>SPORTSMAN</h3>
                               <ul>
                                   <li><img alt="" src="img/sportsman.gif" /><a href="#"></a></li>
                                  
                               </ul>   
                                
                           </div>
                  
                           <div class="col_1">
                          
                               <h3>RANGER</h3>

                              <ul>
                                   <li><img alt="" src="img/sportsman.gif" /><a href="#"></a></li>
                                  
                               </ul>
                                
                           </div>
                  
                           <div class="col_1">
                          
                               <h3>RANGER RZR</h3>
                               <ul>
                                   <li><img alt="" src="img/sportsman.gif" /><a href="#"></a></li>
                                  
                               </ul>

                                
                           </div>
                  
                           <div class="col_1">
                          
                               <h3>MEZZI SPECIALI</h3>
                              <ul>
                                   <li><img alt="" src="img/sportsman.gif" /><a href="#"></a></li>
                                  
                               </ul>
                                
                           </div>
                          
                       </div><!-- End 4 columns container -->

                  
                   </li><!-- End 4 columns Item -->
               
                  
               
               </ul>
</div>

Che era stato postato da Silver il: 02 Marzo, 2012, 15:41:07
... e quì cominciano i guai... so che dovrei modificare i parametri di
Citazione
<div style=" z-index:1000; position: absolute; top: 200px;  width:100%; height: 100%;">

Ma già così mi parte in verticale la barra...

:?
Qualche idea? (io continuo a smanettare)