- Home
- Categorie
- Coding e Sistemistica
- Javascript & Framework
- [Supersized] Button relazionato alla slide corrente
-
[Supersized] Button relazionato alla slide corrente
Sto utilizzando lo script Jquery [url=http://buildinternet.com/project/supersized/]Supersized.
Ho il seguente problema
sullo slider dovrei visualizzare un button che riporti esattamente l'ID o qualche riferimento all'immagine corrente.Così ho inserito nella mie immagini:
slides: [ {image : 'slides/kazvan-1.jpg', id : '1', title : 'TITLE 01', thumb : 'thumbs/kazvan-1.jpg', url : ''}, {image : 'slides/kazvan-2.jpg', id : '2', title : 'TITLE 02: Maria Kazvan', thumb : 'thumbs/kazvan-2.jpg', url : ''}, ],
nella mia pagina ho aggiunto:
<button class="btn_rate">ID: $id</button>
nello script (presente nella demo) in theme/supersized.shutter.js nella funzione afterAnimation ho aggiunto:
afterAnimation : function(){ if (api.options.progress_bar && !vars.is_paused) theme.progressBar(); // Start progress bar //GET del custom field var custom_field = api.getField('id'); //GET del testo dentro il button var text = $("button.btn_rate").text(); //Replace di $id text = text.replace("$id", custom_field); //Visualizzazione $("button.btn_rate").html(text); },
cosa da visualizzare (per il momento) l'ID dell'immagine corrente.
Il tutto funziona, ma:
- nella prima slide non avviene il replace perchè ovviamente lo script viene eseguito in afterAnimation
- se lo inserisco nella metodo beforeAnimation il replace viene eseguito per la prima slide e non per le altre...
Come risolvere?
Grazie.
-
Aggancialo al ready.
Ciao
-
L'errore era dovuto al text.Replace(), andava a cercare sempre $id, al primo tentativo lo trovo, mentre dopo non lo trova più.
Ho inserito il mio metodo nel beforeAnimation() ed effettuato le due modifiche:
- associato un ID al button:
HTML:
<button class="btn_rate" id="">ID: $id</button>
JS:
//GET del custom field var custom_field = api.getField('id'); $("button.btn_rate").attr('id',custom_field);
Grazie!
- associato un ID al button: