Back to top

Autore Topic: Smussare gli angoli del menu..  (Letto 3153 volte)

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Smussare gli angoli del menu..
« il: 15 Nov 2011, 23:17:39 »
Ciao vorrei smussare gli angoli del menu di questo sito.. http://www.igioiellievangelium.it/index.php
come posso fare a renderli un po' più tondi?

Grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #1 il: 16 Nov 2011, 14:46:38 »
Ciao qualcuno ha qualche dritta in merito da darmi?

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #2 il: 16 Nov 2011, 18:08:12 »
ciao non e che molte alternative una farti gli angoli tondi  direttamente  sulla tua immagine
altra alternativa e il css solo che in questo caso  con ie non li vedi ameno che usi il fix per ie
http://css3pie.com/
segui le istgruzioni

Codice: [Seleziona]
#hornav {   
 background: url("../images/barra4.png") repeat-x scroll 0 0 transparent;   
 border-radius: 7px 7px 0 0;<<<<<qui 
  float: right;   
 height: 37px;   
 margin: -20px 9px 0 18px;   
 overflow: hidden;}

navigation.css (riga 6)
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #3 il: 16 Nov 2011, 18:57:42 »
Grazie della risposta,
avevo pensato anche io di disegnarmi l'immagine di sfondo del menu solo che il menu quando un utente si registra al sito visualizza ulteriori due scelte se si logga. Quindi come fa il menu a gestire l'angolo smussato? Si allunga anche l'immagine di sfondo e gli angoli rimangono corretti?

grazie
ciao

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #4 il: 16 Nov 2011, 21:03:09 »
ciao che centra ?
il menu si estende  x cui i due lati  sono  separati dall'immagine.
ricapitoliamo

hai 2 possibilita  una tagliare limmagine in 2 una lunga 5pz che sarà il tuo ungolo destro e una  di 700px  di cui  sarà compreso il tuo angolo sinistro  fatto questo crei il css x gestire il tutto
seconda opzione
immagine tagliata in 3
1 angolo dx
2 angolo sx
3 parte centrale
 il tutto con il suo css.
se a questo  punto ti perdi nel gestire immagini con il css

segui questa  procedura e risolvi sensa immagini
http://css3pie.com/
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #5 il: 17 Nov 2011, 23:19:14 »
Ho provato a seguire la procedura senza immagini in quanto mi sembrava interessante..
Il sito dove ho testato le modifiche è http://www.intrattenendovi.com (in fase di creazione) in quanto quello elencato nel post precedente è già in produzione, quindi meglio evitare casini..

Risultato: Su mozilla vedo bene il menu centrale mentre su IE vedo tutt'altra cosa..

Spiego cosa ho fatto:
Dal sito http://css3pie.com/ ho ottenuto questo codice che ho poi inserito nel mio css:
Ho attivato anche "Enable PIE" che mi sembra di capire che riguarda IE e le righe relative a "Enable PIE" sono le ultime due.. ma in IE non si vede ciò che si dovrebbe vedere..

Da cosa dipende?
Ecco il codice ricavato..
border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #000000;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#000000), to(#938586));
background: -webkit-linear-gradient(#000000, #938586);
background: -moz-linear-gradient(#000000, #938586);
background: -ms-linear-gradient(#000000, #938586);
background: -o-linear-gradient(#000000, #938586);
background: linear-gradient(#000000, #938586);
-pie-background: linear-gradient(#000000, #938586);
behavior: url(/PIE.htc);

Grazie
ciao
« Ultima modifica: 17 Nov 2011, 23:21:13 da simone79vi »

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #6 il: 17 Nov 2011, 23:26:52 »
e questo lo hai scaricato e messo nella tua root?
PIE.htc
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #7 il: 17 Nov 2011, 23:35:56 »
Ora si..
se clicco su http://www.intrattenendovi.com/PIE.htc vedo delle istruzioni.. ma il sito su IE non cambia..

Manca dell'altro?

grazie

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #8 il: 17 Nov 2011, 23:43:16 »
sicuro che il menu in ie funzioni?
io vedo il menu sulla sx e senza grafica
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #9 il: 17 Nov 2011, 23:49:57 »
No non funziona in IE.. solo con Mozilla...

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #10 il: 17 Nov 2011, 23:57:28 »
No non funziona in IE.. solo con Mozilla...
intendo la grafica  normale ?

il menu originale sensa angoli tondi  intendo.
xche non si vede neppure quella , e quello che intendo .
prima di dire che il fix non funzioni accertati che  la grafica normale funzioni .
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #11 il: 18 Nov 2011, 00:00:22 »
Ora ho ripristinato il css originale.. prima delle modifiche degli angoli tondi...
funziona su entrambi i browser..

Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #12 il: 18 Nov 2011, 00:16:48 »
ok
allora c'è il css che non piace a ie .
con il tempo che stai buttando  avresti fatto  l'immagine stondata e abblicata con 2 righe di css e  2 div aggiunti.
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #13 il: 18 Nov 2011, 00:30:17 »
Eh lo so..
ma non penso di essere in grado di.. << con 2 righe di css e  2 div aggiunti >>
Avrei bisogno di una dritta..

Creo il div nell'index.php del template e poi lo specifico nel css?

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #14 il: 18 Nov 2011, 10:09:59 »
Ciao,
ho rifatto il tutto questa mattina e ora sembra andare con CSS3 PIE..
L'unica cosa che non va è il gradiente del colore che su Mozilla si vede mentre su IE no.
Avrei la necessità di centrare il menu, evitando quindi la barra lunga vuota di destra.

Come posso fare?


Offline conti1

  • Global Moderator
  • Instancabile
  • *****
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #15 il: 18 Nov 2011, 10:17:44 »
in ie8 non c'è grafica.
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline simone79vi

  • Abituale
  • ****
  • Post: 821
    • Mostra profilo
Re:Smussare gli angoli del menu..
« Risposta #16 il: 18 Nov 2011, 12:47:47 »
A questo punto megli se mi faccio il pulsante a tutti gli effetti..

Ho bisogno però di un "sostegno".. in merito a .. << con il tempo che stai buttando  avresti fatto  l'immagine stondata e applicata con 2 righe di css e  2 div>>

Non ho mai creato div ma semplicemente modificato css ma è arrivato il momento di farlo..
Creo il div nell'index.php del template e poi lo specifico nel css?

grazie

 



Web Design Bolzano Kreatif