- Home
- Categorie
- Coding e Sistemistica
- Javascript & Framework
- jQuery mostrare alt immagine al click...
-
@gleenk said:
la descrizione deve essere univoca per ogni foto quando ho i 3 tab aperti simultaneamente
Prova cosi:$(document).ready(function() { $('.tabsbob div').hide(); $('.tabul a').each(function(){ $(this).click(function(){ var tabula = $(this).attr('rel'); $('#' + tabula).slideDown(); $('div#img-description_'+tabula).remove(); var altImg = $('#'+tabula+' img').attr('alt'); $('.tabsbob div').append('<div id="img-description_'+tabula+'">' +altImg+ '</div>'); return false; }); }); $('a.slideUp').click(function(){ $(this).parent().slideUp(); }); });
-
nada de nada, si è impallinato tutto ^^
ho caricato online la pagina di prova così vedi bene che cosa intendo
-
Non hai modificato come indicato nel mio ultimo post.
Ti evidenzio in grassetto le modifiche$(document).ready(function() { $('.tabsbob div').hide(); $('.tabul a').each(function(){ $(this).click(function(){ var tabula = $(this).attr('rel'); $('#' + tabula).slideDown(); **$('div#img-description_'+tabula).remove();** var altImg = $('#'+tabula+' img').attr('alt'); **$('.tabsbob div').append('<div id="img-description_'+tabula+'">' +altImg+ '</div>');** return false; }); }); $('a.slideUp').click(function(){ $(this).parent().slideUp(); }); });
-
le ho provate in locale ma non andavano, saltava solo il css perchè modificavi la classe img-description
quindi ho rimesso com'era
-
riprovo sul file di prova e ti faccio sapere.
Riguardo al css del div con id img-description ricordati che in una pagina html gli id devono essere univoci.
-
Questo dovrebbe andare al 99%.
Riguardo al css applica al div img-description la classe omonima
modificando la regola da "#img-description" a ".img-description".$(document).ready(function() { $('.tabsbob div').hide(); $('.tabul a').each(function(){ $(this).click(function(){ var tabula = $(this).attr('rel'); $('#' + tabula).slideDown(); $('#img-description_'+tabula).remove(); var altImg = $('#'+tabula+' img').attr('alt'); $('.tabsbob #'+tabula).append('<div id="img-description_'+tabula+'" class="img-description">' +altImg+ '</div>'); return false; }); }); $('a.slideUp').click(function(){ $(this).parent().slideUp(); }); });
-
evviva! così funziona! mi sto ancora chiedendo come faccia a funzionare... come fa ad identificare le immagini in modo univoco?
-
Perchè agisce per ogni '.tabul a', dunque per ogni id voceX (voce1, voce2, etc...), creando anche un div con id univoco 'img-description_'+tabula' (img-description_voce1, img-description_voce2, etc...).
-
scusa la mia ignoranza, ma mi sfugge ancora il nocciolo... in che punto del codice lui capisce che quell'immagine è associata al mio click su quella voce di menù senza confondersi con le altre?
nn riesco a capire... il div con ID img-description_ viene aggiunto alla fine del nostro codice e prima non c'è nulla che gli dica che quella "tabula" è proprio quella (che casino!).PS: mi sa che mi sorge il dubbio che lo faccia perchè io ho creato 3 div con id diverso per le 3 voci (non avevo visto!), se non avessi fatto così? sarebbe stato impossibile?
grazie uomini pazienti ^^
-
@gleenk said:
scusa la mia ignoranza, ma mi sfugge ancora il nocciolo... in che punto del codice lui capisce che quell'immagine è associata al mio click su quella voce di menù senza confondersi con le altre?
nn riesco a capire... il div con ID img-description_ viene aggiunto alla fine del nostro codice e prima non c'è nulla che gli dica che quella "tabula" è proprio quella (che casino!).Lo permette l'each
@gleenk said:
PS: mi sa che mi sorge il dubbio che lo faccia perchè io ho creato 3 div con id diverso per le 3 voci (non avevo visto!), se non avessi fatto così? sarebbe stato impossibile?
grazie uomini pazienti ^^
Si, ma sarebbe stato un po' più complicato