Dopo aver usato qualche scriptino già sviluppato, vorrei iniziare con un pò di pratica a fare qualcosina con Javascript.
Aiutandomi con Prototype e qualche effetto Scriptacolous, vorrei realizzare uno scrolling orizzontale di immagini (tipo carousel) che richiami le immagini seguenti grazie ad Ajax.
Impostati i css ad hoc , impostando un div con overflow:hidden, una lista <ul> con una dimesione tale da contenere orizzontalmente anche le immagini in background,con le sue immagini[*], ho combinato ciò:
Codice PHP:
var Scorrimento=
{
//scorre le immagini a destra
muovidx:function(){
new Effect.Move('miniature', { x: -920, y: -0, mode: 'relative',sync:false,afterFinish:Scorrimento.aggiungi});
},
//scorre le immagini a sinistra
muovisx:function(){
new Effect.Move('miniature', { x: 920, y: -0, mode: 'relative'});
},
//aggiunge 2 nuovi[*] alla fine della lista
aggiungi:function(){
new Ajax.Updater('miniature','ajax.php', {evalScripts: true,insertion: Insertion.Bottom , parameters: { id:'{$id_categoria[$counter2]}' },onComplete:Scorrimento.rimuovi });
},
//rimuove i primi due[*] ,ormai invisibili, dall'inizio della lista
rimuovi:function(){
var prodotti=document.getElementsByClassName('item',$('miniature'));
prodotti[0].remove();
prodotti[1].remove();
//sistema la posizione...
new Effect.Move('miniature', { x: 920, y: -0, mode: 'relative',transition:Effect.Transitions.full});
},
};
In pratica innanzitutto con l'effetto Move di Scriptaculous muovo la lista ul di quanto basta per scorrere due immagini:quindi con AJAx inserisco due immagini in fondo all'elenco (ancora invisibile) e rimuovo le prime due immagini ,ormai invisibili.
Il problema nasce perchè spostato il menu <ul>, quando rimuovo i primi due elementi, i rimanenti giustamente li rimpiazzano nel DOM occupando la loro posizione,nascosta.
Per sistemarlo risposto la lista <ul> dall'altro verso subito dopo aver rimosso gli elementi e il tutto funziona ma, a parte un lieve sfarfallio, volevo sapere che strada intraprendere per una soluzione meno ortodossa...
Grazie a chi mi saprà aiutare