Joomla.it Forum
Joomla! 2.5 (versione con supporto terminato) => Joomla! 1.6/1.7/2.5 => : Fabio7586 11 Feb 2012, 20:41:30
-
Salve ragazzi, avrei bisogno di creare un menų di questo tipo http://gabrieleromanato.com/esempi/jquery/jquery-menu-cursore.html (http://gabrieleromanato.com/esempi/jquery/jquery-menu-cursore.html), avevo scritto all'autore di questa guida, ma mi ha risposto che non conosce il templating di joomla, per cui chiedo a voi, se possibile, di aiutarmi ad integrare questo codice nel mio template in joomla
in HTML
<div id="navigation"> <ul> <li><a href="#">Home[/url]</li> <li><a href="#">About[/url]</li> <li><a href="#">Contatti[/url]</li> </ul> <div id="cursor"></div> </div>
In CSS
#navigation { height: 3em;} #navigation ul { height: 2em; border-bottom: 1px solid #232323; margin: 0; padding: 0 1em; list-style: none;} #navigation li { float: left; height: 100%; margin-right: 1em;} #navigation a { float: left; height: 100%; padding: 0 1em; line-height: 2; font-weight: bold; text-decoration: none; color: #fff; background: #232323; border-radius: 6px 6px 0 0;} #navigation a:hover { background: #666;} #cursor { background: #e40; height: 0.5em; width: 0px; position: relative;}
in JQ
$(function() { $('li', '#navigation').each(function() { var $li = $(this); var $a = $('a', $li); var width = $li.width(); var left = $li.position().left; $a.mouseover(function() { $('#cursor', '#navigation').animate({ width: width, left: left }, 'slow'); }); }); });
Non saprei da dove cominciare! :)
La versione di joomla č l'ultima disponibile (2.5.1)
-
jquery č giā un plugin per joomla, verifica se ti va bene quello che sta nel sito che porto in firma e poi installi quello..
-
In veritā cercavo di creare un menų con un effetto di cursore scorrevole e in pių a con sottomenų a tendina come nell'esempio del link che ho pubblicato pių su; il codice per farlo funzionare cosė č quello che ho indicato, ma non so come integrarlo nel mio template.
Quello nel tuo sito in firma, non č quello che cerco di fare :)
-
mancherebbero solo le righe html e css mentre jquery ci sta giā,
provo ad inserirle in locale, ti faccio sapere.
-
con il plugin si potrebbe fare, ci vuole tanta pazienza e tempo.. anche perchč solo di file .js nel plugin ce ne sono 5, un po di prove e si fa.. forza e coraggio...
-
Grazie innanzitutto per l'aiuto che mi stai dando, ma, ti prego di perdonarmi, sono un neofita di joomla, di che plugin parli? che significa mancherebbero solo le righe html e css? non si devono modificare quelle che ho scritto per fare riferimento alle voci di menų che ho io? :)
Facciamo pių semplice, ho questa roba qui http://www.webdesignshock.com/animated-jquery-menu/ e devo riprodurla esattamente come si presenta; come faccio ad installarla?
Se puoi spiegarmi, te ne prego fallo punto per punto, se non sono troppi e non ti disturbo troppo :)
-
Nessuno puō aiutarmi? :'(
-
ciao
il menu che stai tentando di fare esiste gia
http://www.joomlack.fr/Extensions-Joomla/Menu/maxi-menu-ck-menu-deroulant-avance.html (http://www.joomlack.fr/Extensions-Joomla/Menu/maxi-menu-ck-menu-deroulant-avance.html)
con un poco di modifiche al css lo fai come vuoi tu.
quarda http://www.contiwebsolution.com/demo1.7/
-
ciao
il menu che stai tentando di fare esiste gia
http://www.joomlack.fr/Extensions-Joomla/Menu/maxi-menu-ck-menu-deroulant-avance.html (http://www.joomlack.fr/Extensions-Joomla/Menu/maxi-menu-ck-menu-deroulant-avance.html)
con un poco di modifiche al css lo fai come vuoi tu.
quarda http://www.contiwebsolution.com/demo1.7/ (http://www.contiwebsolution.com/demo1.7/)
Mi spieghi da dove devo partire se non ti č di disturbo? Debbo fare tutto con il plugin, oppure debbo modificare qualche file? Quale poi?
-
ciao
da dove partire?
inizia a scaricare il modulo menu lo installi e poi modifichi il css del menu e lo fai come quello postato da te.
-
ciao
da dove partire?
inizia a scaricare il modulo menu lo installi e poi modifichi il css del menu e lo fai come quello postato da te.
Allora io ho un index.html, cartella js, img e css nella root principale; in css trovo main e style con questi codici:
Main
.mainmenuslide {
height: 29px; width:550px;
background: url("../img/background_main.png") no-repeat top; position: relative;
padding: 15px 0 15px 0; margin: 0 -10px 0;
}
.mainmenuslide li {
padding: 16px 0 11px 25px; margin: -18px 0 0 9px;
float: left; list-style: none;
}
.mainmenuslide li.back {
background: url("../img/hover_main.png") no-repeat right -52px;
width: 9px; height: 30px; padding: 0px 0 22px 0;
z-index: 1; margin: -12px 0 0 8px; position: absolute;
}
.mainmenuslide li.back .left {
background: url("../img/hover_main.png") no-repeat top left ;
padding: 0px 0 22px 0; height: 30px; margin-right: 24px;
}
.mainmenuslide li a {
font: bold 14px arial;
top: 7px; z-index: 2; float: left;
height: 30px; position: relative;
margin: auto 10px; outline: none;
}
Style.css
@charset "utf-8";
/* CSS Document */
/**** Body ***/
body{
background:#aedae9;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
line-height:normal;
color:#FFF;
margin:0;
}
/**** Links ***/
a{ text-decoration: none;color:#FFF;}
a:link{ text-decoration:none;}
a:visited{ text-decoration:none;}
/**** Header ***/
#header{
background: url(../img/background_header.png) no-repeat;
width:1000px;
height:108px;
margin:auto;
}
.header_navigation{
float:right;
width:550px;
height:24px;
margin:24px 0 0 0;
}
/**** content ***/
#content{
width:940px;
margin:auto;
border-left:1px solid gray; border-bottom:1px solid gray ; border-right:1px solid gray ;
padding: 30px;
min-height:500px;
}
/**** Footer ***/
#footer{
width:1000px;
margin:auto;
}
In index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Slide menu with jQuery and CSS | iconshock</title>
<link href="css/style.css" rel="stylesheet" media="screen" />
<link rel="stylesheet" href="css/main.css" type="text/css" media="screen">
<script type="text/javascript" src="js/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/jquery.mainmenuslide.js"></script>
<script type="text/javascript">
$(function() {
$("ul").mainmenuslide({
fx: "backout",
speed: 700,
click: function(event, menuItem) {
return false;
}
});
});
</script>
</head>
<body>
<div id="header">
<div class="header_navigation">
<ul class="mainmenuslide">
<li><a href="#" alt="">Home[/url]</li>
<li><a href="#" alt="">Portafolio[/url]</li>
<li><a href="#" alt"">Services[/url]</li>
<li><a href="#" alt"">Blog[/url]</li>
<li><a href="#" alt"">Contact[/url]</li>
</ul>
</div><!-- end header_navigation-->
</div><!-- end header -->
<div id="content">
<p> En este div va el contenido dinamico de la pagina (content).</p>
</div><!-- end content -->
<div id="footer"></div><!-- End footer-->
</body>
</html>
Il codice css ho provato a copiarlo maximenu_CK.css nella cartella assets, ma non rilevo ne possibili errori nella visualizzazione ne succede nient'altro. In index poi sono definite le voci di menų, io come faccio a richiamere quelle che giā ho?
Cerco di capire come fare cosė una volta fatto per uno posso farlo per tutti quelli che mi interessano; il menų che ho proposto č fatto in jquery, non č che c'č anche una chiamato a qualche funzione di questo framework?
-
Il codice css ho provato a copiarlo maximenu_CK.css nella cartella assets
il css devi costruirlo sul css del modulo e non copiare quello dal sito postato da te.
fare quel menu con il modulo menu che ti dato e facilissimo , hai 3 immagini su quel menu uno di sfondo e e 2 sono il pulsante che scorre tutto quello che devi fare e integrare le immagini e nulla d'altro.
-
il css devi costruirlo sul css del modulo e non copiare quello dal sito postato da te.
fare quel menu con il modulo menu che ti dato e facilissimo , hai 3 immagini su quel menu uno di sfondo e e 2 sono il pulsante che scorre tutto quello che devi fare e integrare le immagini e nulla d'altro.
ti prego, non chiamarmi rompipalle, non č che potresti dirmi dettagliatamente cosa devo fare, cosa devo scrivere e dove? html e css li conosco un pochino, am non abbastanza da fare da solo, sto ancora capendo come funziona approfonditamente joomla e sto studiando java, non ho ancora il tempo per fare uno studio approfondito su queste cose qui.
Tutto questo chiedendoti grazie per il tempo che mi stai dedicando! :)
-
allora
per costruire un menų personalizzato come lo vuoi tu , va fatto di-rettamente sul template che usi solo in questo modo avrai i giusti parametri dei css.
allora non conoscendo che tipo di tempate stai usando anche dirti come fare potrei sempre rincorrere a parametri sballati.
tanto x iniziare la grafica dello sfondo di quel menų va creata nel div della posizione del menų.
l'immagine deve essere fatta in modo che si estenda in larghezza in base hai tuoi contenuti.
invece quella che scorre interna deve essere fatta nel css del menų che installato se hai visto in modulo hai giā un menų con lo scorrimento interno devi solo sostituire le immagini con le tue.
-
allora
per costruire un menų personalizzato come lo vuoi tu , va fatto di-rettamente sul template che usi solo in questo modo avrai i giusti parametri dei css.
allora non conoscendo che tipo di tempate stai usando anche dirti come fare potrei sempre rincorrere a parametri sballati.
tanto x iniziare la grafica dello sfondo di quel menų va creata nel div della posizione del menų.
l'immagine deve essere fatta in modo che si estenda in larghezza in base hai tuoi contenuti.
invece quella che scorre interna deve essere fatta nel css del menų che installato se hai visto in modulo hai giā un menų con lo scorrimento interno devi solo sostituire le immagini con le tue.
Nel template che ho allegato ho trovato un file tdefault.css con tutti gli stili del template; so che mi sto dilugando tanto, non so cosa eliminare e cosa aggiungere nel file, non so se va in conflitto con qualche altra cosa, invece lo scorrimento interno non vedo il menu giā pronto con lo slide :)
[allegato eliminato da un amministratore essendo vecchio pių di un anno]
-
Non č che potresti farlo tu e spiegarmi punto per punto ciō che fai :) ? sto provando da due ore, ma non riesco a far nulla.... :'(
-
allora
ho modificato l' index.php del template dove hai il div del topmenu
modificato il css e e creato il tuo menų con il css del menų che to postato
ora ti passo lo zip del template completo del menų
il secondo zip e il css del modulo che devi integrare
vai nei moduli poi sul modulo del menų ck e poi su themes ci incolli quello che ti posto poi torni in gestione moduli e attivi il default03
e hai il tuo menu fatto
ti resta di personalizzare solo la tendina che io lo lasciata del colore originale.
ps o dovuto disabilitare il mootools che nella cartella html altrimenti il mio menu almeno la mia versione non vunzionava non ho l'ultimo del sito che to darto.
altra cosa la grafica gia di suo non e emogenia
questo e il risultato
[allegato eliminato da un amministratore essendo vecchio pių di un anno]
-
allora
ho modificato l' index.php del template dove hai il div del topmenu
modificato il css e e creato il tuo menų con il css del menų che to postato
ora ti passo lo zip del template completo del menų
il secondo zip e il css del modulo che devi integrare
vai nei moduli poi sul modulo del menų ck e poi su themes ci incolli quello che ti posto poi torni in gestione moduli e attivi il default03
e hai il tuo menu fatto
ti resta di personalizzare solo la tendina che io lo lasciata del colore originale.
ps o dovuto disabilitare il mootools che nella cartella html altrimenti il mio menu almeno la mia versione non vunzionava non ho l'ultimo del sito che to darto.
altra cosa la grafica gia di suo non e emogenia
questo e il risultato
Innanzitutto ti ringrazio per l'enorme lavoro che hai svolto per aiutarmi!!!! :) Ma purtroppo non riesco ancora a farlo funzionare, ho fatto tutto ciō che mi hai detto, ho sovrascritto il template che mi hai dato (l'ho installato anche daccapo) ed ho messo nella cartella theme di maximenuck il default03 che mi hai passato, ho selezionato lo stesso dal tool del menų, ma nisba; in allegato ho inserito tutte le impostazioni che mi hai suggerito ed il risultato che ottengo io. Non so che cosa modificare ancora! :'(
[allegato eliminato da un amministratore essendo vecchio pių di un anno]
-
ciao
allora ricapitoliamo
il file che to dato del menu in precedenza con il menu nuovo non funziona tu hai installato la vesione mod_maximenuck_6.0.1_j25
usa questo zip x questa vesione
[allegato eliminato da un amministratore essendo vecchio pių di un anno]
-
ciao
allora ricapitoliamo
il file che to dato del menu in precedenza con il menu nuovo non funziona tu hai installato la vesione mod_maximenuck_6.0.1_j25
usa questo zip x questa vesione
Alleluja!!!!! Grazieeeeee!!!!
Ti posso chiedere un'ultima cosa, mi puoi spiegare per filo e per segno cosa hai fatto e quali voci hai modificato nel file index e nel css? Vorrei essere in greado di replicare le stesse procedure anche con altri menų che ho visto in giro e che ritengo interessanti!
Veramente grazie mille per l'aiuto che mi hai dato! Ti ci vorrebbe una statua!
-
Ciao, allora, ho provato ad integrare quello che hai fatto nel sito; mentre in locale tutto funge alla perfezione, nel sito il layout č tutto disordinato; inoltre lo slide scompare se non attivo le funzioni mootool che in locale avevo disattivato; non so come fare; ho provato anche a modifica le posizioni nel css, ma forse sbaglio perchč non cambia nulla! :'(
Puoi aiutarmi? :)
[allegato eliminato da un amministratore essendo vecchio pių di un anno]