Potreste spiegarmi come installare jcarousel con l'autoscrolling orizzontale? Ho provato a fare come nel post http://drupal.org/node/197040 ma non ci sono riuscito
Potreste spiegarmi come installare jcarousel con l'autoscrolling orizzontale? Ho provato a fare come nel post http://drupal.org/node/197040 ma non ci sono riuscito
Ci sono una marea di modi con cui puoi sbagliare.
Ti consiglio di caricare lo .zip
Testare se funziona il carosello su desktop.
A questo punto passo passo implementarlo nella tua pagina.
Quando copi nella tua cartella del tema devi modificare il .js per reindirizzare la ricerca delle immagini; se modifichi o sposti la cartella dove si trovano le foto devi modificare il .js; se inserisci foto, devi modificare il .js; nel tema devi inserire il persorso corretto dove si trova il .js e il .css....insomma sicuramente sbagli qualche cosa.
Allora, ho riiniziato l'installazione da capo.
Passo Passo
1) Ho inserito la cartella jCarousel nella directory modules di Drupal
2) Ho Attivato il modulo dall'amministrazione di Drupal
3) Jquery update era gia attivo (installato precedentemente)
4) Nella cartella themes/garland/ ho installato la cartella jcarousel con tutti i file css e javascript
5) Ora vado nel file page.tpl.php e tra i tag head incollo il codice per avere un carousel con scrolling automatico (ho controllato i percorsi e sono tutti corretti):
<script type="text/javascript" src="/jcarousel/lib/jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="/jcarousel/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="/jcarousel/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="/jcarousel/skins/tango/skin.css" />
<script type="text/javascript">
function mycarousel_initCallback(carousel)
{
// Disable autoscrolling if the user clicks the prev or next button.
carousel.buttonNext.bind('click', function() {
carousel.startAuto(0);
});
carousel.buttonPrev.bind('click', function() {
carousel.startAuto(0);
});
// Pause autoscrolling if the user moves with the cursor over the clip.
carousel.clip.hover(function() {
carousel.stopAuto();
}, function() {
carousel.startAuto();
});
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
auto: 2,
wrap: 'last',
initCallback: mycarousel_initCallback
});
});
</script>
6) Mi creo un tipo di contenuto page e nel corpo incollo il seguente codice impostando Input type "full html" (il percorso delle foto è giusto perchè remoto):
<ul id="mycarousel" class="jcarousel-skin-tango">
<li><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/58/199481218_264ce20da0_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/69/199481255_fdfe885f87_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/70/229228324_08223b70fa_s.jpg" width="75" height="75" alt="" /></li>
</ul>
Quando inserisco il contenuto ottengo le foto impilate una sull'altra senza nessun effetto javascript
Dove sbaglio?
E' semplice ti posso dire così ad occhio che hai sbagliato il percorso del file .js e .css
Ti basta fare un Visualizza HTML per vedere l'errore nel percorso!
Ovviamente lo devi confrontare con gli altri percorsi!
Ok ho cambiato i percorsi dei file javascript e css nel file page.tpl.php del tema:
<script type="text/javascript" src="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/skins/tango/skin.css" />
Ora però visualizzo il Jcarousel su Firefox ma non su IE
Nell'HTML ottengo il codice (uso il tema SKY):
<script type="text/javascript" src="/drupal-5.6/themes/sky/jcarousel/lib/jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="/drupal-5.6/themes/sky/jcarousel/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="/drupal-5.6/themes/sky/jcarousel/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="/drupal-5.6/themes/sky/jcarousel/skins/tango/skin.css" />
In entrambi i Browser. Ma IE non funziona
Mi sai consigliare i giusti percorsi?
Se funziona su Firefox allora non hai sbagliato! e i percprso sono corretti. E' IE che fa schifo. Li ti devi documentare su come farlo funzionare anche con IE, probabilmente ci sarà scritto nel sito da dove hai scaricato il pacchetto.
Ho controllato aprendo i file di esempio del pacchetto Jcarousel e su IE c'è il problema dell'abilitazione degli script activex che mi chiede di attivare.
Il problema è che aprendo la pagina con il jcarousel nel mio sito Drupal su IE non mi chiede un bel niente e stampa la pagina senza effetti Javascript.
A questo punto ti chiedo se c'è un settaggio particolare per fare in modo di far visualizzare gli effetti javascript in IE senza incorrere nel blocco activex perchè nel sito ufficiale di jcarousel http://sorgalla.com non ho trovato nulla.