WebSite X5Help Center

 
5t3llino ..
5t3llino ..
User

AIUTO MODIFICA CSS IN MENU  it

Автор: 5t3llino ..
Просмотрено 1510, Подписчики 1, Размещенный 0  

SALVE, MI SERVIREBBE MODIFICARE 2 COSE IN QUESTO CSS.....

A) ALLINEARE CENTRALMENTE LE VOCI DEL MENU (dove e come inserire questo comando)

B) come modificare l'altezza del riquadro blu indicato dal puntatore (in allegato)

affinchè sia uguale all'altezza del riquadro accanto 

http://www.wowx.altervista.org/

VI RINGRAZIO ANTICIPATAMENTE....

Размещено
24 Ответы - 9 Полезно - 1 Корректно
 lemonsong  
 lemonsong  
User

Per la B, segui la freccia (vedi allegato).

File css/style.css

_______ oltre il 5° step ________

http://www.unofficialwsx5.com

Читать больше
Размещено От  lemonsong  
 lemonsong  
 lemonsong  
User

Ehm, ecco l'allegato...

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

benissimo, il risultato cè, ma ho dovuto modificare quel valore nell'index con notepad++,

ovviamente se modifico qualunque cosa con Ws ed esporto, quel valore mi cambierebbe....

invece vorrei capire dove è collocato quella stringa in ws.....

Читать больше
Размещено От 5t3llino ..
5t3llino ..
5t3llino ..
User
Автор

risolto......

per l'allineamento centrale ci sono soluzioni?

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User

Nello script jQuery trova questa riga:

.animate({'top':'140px'},500,'easeOutBack')

... ed aumenta il valore di top

Hai caricato la vecchia libreria jQuery 1.4.2 ma WS già la include, rimuovila.

Читать больше
Размещено От  lemonsong  
 lemonsong  
 lemonsong  
User
 lemonsong  
Hai caricato la vecchia libreria jQuery 1.4.2 ma WS già la include, rimuovila.

Ne hai caricata un'altra: engine1/jquery.js

Rimuovi pure quella.

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

FORSE PER ME è UN PO ARABO....

vecchia libreria?......il Ws la genera? ....non ti sto seguendo :D

mi farebbe però piacere che mi spiegassi....GRAZIE !!!!! :)

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User
Studio Vox
FORSE PER ME è UN PO ARABO....

Questo l'avevo capito.

Se usi le funzioni del programma, senza avventurarti in personalizzazioni, non avrai problemi.

Altrimenti, un minimo di infarinatura è d'obbligo.

Prendilo come come un consiglio amichevole e non come una critica distruttiva

WS ha già la libreria jQuery, quindi, non avrai bisogno di caricarne altre (se non forse in rarissimi casi).

http://it.wikipedia.org/wiki/JQuery

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

HO PROVATO A MODIFICARE QUEL VALORE, ma mi sposta in basso o in alto le voci del riquadro al di sotto le voci del menu....mi serviva la centratura delle voci sulla barra...

Читать больше
Размещено От 5t3llino ..
5t3llino ..
5t3llino ..
User
Автор

FIGURATI, ALTRO CHE CRITICA, IO SONO QUI PER MIGLIORARE, NON POSSONO ESSERE CHE DEI TOCCASANA QUESTI "CONSIGLI" :)))))

CMQ SE WS HA UNA LIBRERIA JQUERY, IL MENU DOVREBBE FUNZIONARE ANCHE SE NON UPPASSI QUEL FILE DA FTP ESTERNO? invece come mai non è cosi...? cioè se nn lo esporto non funge.... O.o :D

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User
Studio Vox
mi serviva la centratura delle voci sulla barra...

OK, avevo capito male.

Sempre nel solito file .css, trova queste regole e modificale in modo da ottenere questo:

ul.sdt_menu li span span.sdt_link {
    clear: both;
    color: #fff;
    display: block;
    font-size: 24px;
    margin-left:0;
    text-align: center;
}


ul.sdt_menu li span.sdt_wrap {
    height: 60px;
    position: absolute;
    top: 25px;
    width: 170px;
    z-index: 15;
}

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

grazie..... *___*

Читать больше
Размещено От 5t3llino ..
5t3llino ..
5t3llino ..
User
Автор

@lemonsong noto che i sottomenu hanno un z-index forse da aumentare poichè vengono coperti dal content blu....

come risolvere ESATTAMENTE?

GRAZIE ^_^

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User

Nel sito non vedo le modifiche per la centratura.

Comunque, z-index prova ad inserirlo a questo selettore:

ul.sdt_menu li div.sdt_box{


bla bla bla...

z-index:10;

}

Eventualmente da aumentare.

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

@lemonsong ho sostituito quelle voci per la centratura nello style css (come in allegato)

non capisco perkè non funzionino...

per lo z-index menu, ok risolto grazie...

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User

Attualmente, online non hai modificato niente (vedi allegato).

Se hai allegato il file al codice, devi rimuoverlo ed aggiungerlo di nuovo, altrimenti le modifiche che fai non vengono aggiornate, perché viene letto sempre il file "vecchio".

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

HO MODIFICATO NEL CSS CHE è NELLA ROOT....

allora....

QUESTO è NEL WIDGET INTESTAZIONE:

<div class="content">

<ul id="sdt_menu" class="sdt_menu">
<li>
<a href="http://www.villaggiolepalatine.it/villette.html">
<img src="images/1.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Villette</span>
<span class="sdt_descr"></span>
</span>
</a>
</li>
<li>
<a href="http://www.villaggiolepalatine.it/spiaggia-1.html">
<img src="images/2.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Spiaggia</span>
<span class="sdt_descr"></span>
</span>
</a>
</li>
<li>
<a href="">
<img src="images/3.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Attività</span>
<span class="sdt_descr"></span>
</span>
</a>
<div class="sdt_box">
<a href="http://www.villaggiolepalatine.it/sport-e-tempo-libero.html">Sport e Tempo Libero</a>
<a href="http://www.villaggiolepalatine.it/animazione.html">Animazione</a>
<a href="http://www.villaggiolepalatine.it/tour-e-visite-guidate.html">Tour e Visite Guidate</a>
</div>
</li>
<li>
<a href="">
<img src="images/4.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Servizi</span>
<span class="sdt_descr"></span>
</span>
</a>
<div class="sdt_box">
<a href="http://www.villaggiolepalatine.it/bar.html">Bar</a>
<a href="http://www.villaggiolepalatine.it/ristorante---pizzeria.html">Ristorante - Pizzeria</a>
<a href="http://www.villaggiolepalatine.it/market.html">Market</a>
<a href="http://www.villaggiolepalatine.it">Edicola Bazar</a>
<a href="http://www.villaggiolepalatine.it/parrucchiere.html">Parrucchiere</a>
<a href="http://www.villaggiolepalatine.it/navetta.html">Navetta</a>
</div>
</li>
<li>
<a href="http://www.villaggiolepalatine.it/tariffe.html">
<img src="images/5.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Tariffe</span>
<span class="sdt_descr"></span>
</span>
</a>
</li>
<li>
<a href="http://www.villaggiolepalatine.it/contatti.html">
<img src="images/6.jpg" alt=""/>
<span class="sdt_active"></span>
<span class="sdt_wrap">
<span class="sdt_link">Contatti</span>
<span class="sdt_descr"></span>
</span>
</a>
</li>
</ul>
</div>

<!-- The JavaScript -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
/**
* for each menu element, on mouseenter,
* we enlarge the image, and show both sdt_active span and
* sdt_wrap span. If the element has a sub menu (sdt_box),
* then we slide it - if the element is the last one in the menu
* we slide it to the left, otherwise to the right
*/
$('#sdt_menu > li').bind('mouseenter',function(){
var $elem = $(this);
$elem.find('img')
.stop(true)
.animate({
'width':'170px',
'height':'170px',
'left':'0px'
},400,'easeOutBack')
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'140px'},500,'easeOutBack')
.andSelf()
.find('.sdt_active')
.stop(true)
.animate({'height':'130px'},300,function(){
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length){
var left = '170px';
if($elem.parent().children().length == $elem.index()+1)
left = '-170px';
$sub_menu.show().animate({'left':left},200);
}
});
}).bind('mouseleave',function(){
var $elem = $(this);
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length)
$sub_menu.hide().css('left','0px');

$elem.find('.sdt_active')
.stop(true)
.animate({'height':'0px'},300)
.andSelf().find('img')
.stop(true)
.animate({
'width':'0px',
'height':'0px',
'left':'85px'},400)
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'25px'},500);
});
});
</script>

QUESTO è LO STYLE IN CSS CARTELLA ROOT:

ul.sdt_menu{
margin:0;
padding:0;
list-style: none;
font-family:"Century Gothic", "Arial", sans-serif;
font-size:12px;
width:1020px;

}
ul.sdt_menu a{
text-decoration:none;
outline:none;


}
ul.sdt_menu li{
float:left;
width:170px;
height:85px;
position:relative;
cursor:pointer;

}
ul.sdt_menu li > a{
position:absolute;
top:0px;
left:0px;
width:170px;
height:85px;
z-index:12;
background:transparent url(../images/overlay.png) no-repeat bottom right;
-moz-box-shadow:0px 0px 2px #000 inset;
-webkit-box-shadow:0px 0px 2px #000 inset;
box-shadow:0px 0px 2px #000 inset;
}
ul.sdt_menu li a img{
border:none;
position:absolute;
width:0px;
height:0px;
bottom:0px;
left:85px;
z-index:1000000;
-moz-box-shadow:0px 0px 4px #000;
-webkit-box-shadow:0px 0px 4px #000;
box-shadow:0px 0px 4px #000;
}
ul.sdt_menu li span.sdt_wrap{
position:absolute;
top:25px;
width:170px;
height:60px;
z-index:15;

}
ul.sdt_menu li span.sdt_active{
position:absolute;
background:#13284b;
top:85px;
width:170px;
height:0px;
left:0px;
z-index:14;
-moz-box-shadow:0px 0px 4px #000 inset;
-webkit-box-shadow:0px 0px 4px #000 inset;
box-shadow:0px 0px 4px #000 inset;
}
ul.sdt_menu li span span.sdt_link,
ul.sdt_menu li span span.sdt_descr,
ul.sdt_menu li div.sdt_box a{
margin-left:15px;
text-transform:uppercase;
text-shadow:1px 1px 1px #000;
}
ul.sdt_menu li span span.sdt_link{
clear: both;
color: #fff;
display: block;
font-size: 24px;
margin-left:0;
text-align: center;
}
ul.sdt_menu li span span.sdt_descr{
color:#FFFF00;
float:left;
clear:both;
width:155px; /*For dumbass IE7*/
font-size:10px;
letter-spacing:1px;
}
ul.sdt_menu li div.sdt_box{
display:block;
position:absolute;
width:170px;
overflow:hidden;
height:130px;
top:85px;
left:0px;
display:none;
background:#13284b;
z-index:100;
}
ul.sdt_menu li div.sdt_box a{
float:left;
clear:both;
line-height:17px;
color:#ffffff;
}
ul.sdt_menu li div.sdt_box a:first-child{
margin-top:15px;
}
ul.sdt_menu li div.sdt_box a:hover{
color:#ffffff;
text-decoration:underline;
}

QUESTO è IN HEAD:

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<style>
body{
background:#;
font-family:Century Gothic;
}
span.reference{
position:fixed;
left:10px;
bottom:10px;
font-size:12px;
}
span.reference a{
color:#aaa;
text-transform:uppercase;
text-decoration:none;
text-shadow:1px 1px 1px #000;
margin-right:30px;
}
span.reference a:hover{
color:#ddd;
}
ul.sdt_menu{
margin-top:150px;
}

</style>

Читать больше
Размещено От 5t3llino ..
5t3llino ..
5t3llino ..
User
Автор

e dato che ci siamo, @lemonsong come faccio a cambiare il colore alla voce del menu che si ripete in basso? (indicato dal puntatore in allegato)

cambiando quella delle voci menu cambia in automatico anche quella....

come risolvere? 

GRAZIE ^_^

Читать больше
Размещено От 5t3llino ..
 lemonsong  
 lemonsong  
User

Facciamo un gioco...

Trova la modifica che ho fatto qui, è semplice:

http://lemonsong.altervista.org/test_SlideDownBoxMenu/

L'altro post, con la Divina Commedia in codice, non l'ho capito ma, prima di continuare con un'altra domanda, ti consiglio di spendere un po' di tempo per leggerti un po' di guide online gratuite.

Читать больше
Размещено От  lemonsong  
5t3llino ..
5t3llino ..
User
Автор

@lemonsong,

ho estrapolato la sorgente...apro in notepad++

e confrontandoli non riesco a trovare questa modifica :((((

Читать больше
Размещено От 5t3llino ..
5t3llino ..
5t3llino ..
User
Автор

RISOLTO GRAZIE... :)

Читать больше
Размещено От 5t3llino ..