[Supersized] Button relazionato alla slide corrente

felino

Utente Attivo
12 Dic 2013
940
10
18
Aci Catena (Catania)
Sto utilizzando lo script Jquery 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:
Codice:
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:
Codice:
<button class="btn_rate">ID: $id</button>

nello script (presente nella demo) in theme/supersized.shutter.js nella funzione afterAnimation ho aggiunto:
Codice:
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:
1) nella prima slide non avviene il replace perchè ovviamente lo script viene eseguito in afterAnimation
2) se lo inserisco nella metodo beforeAnimation il replace viene eseguito per la prima slide e non per le altre...

Come risolvere?

Grazie.
 
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:
Codice:
<button class="btn_rate" id="">ID: $id</button>

JS:
Codice:
//GET del custom field
var custom_field = api.getField('id');

$("button.btn_rate").attr('id',custom_field);

Grazie! :)
 

Discussioni simili