Comment optimiser ce code s'il vous plait ?

Question

Posez votre question Signaler

Comment optimiser ce code s'il vous plait ?

lhorn - 8 juin 2016 à 11:49 - Dernière réponse : cs_AccessToYou 34 Messages postés mardi 21 novembre 2000Date d'inscription 16 juin 2016 Dernière intervention

- 15 juin 2016 à 04:04

Javascript / DHTML Posez votre question Signaler

Bonjour,

est-ce qu'il est possible d'optimiser le code si dessous pour éviter la répétition du code de façon à ce que le numéro reste en variable, pour que ce soit valable quelque soit le nombre d'éléments

et ainsi avoir un bout de code ou VAR est une variable ou une valeur généré par une fonction


$('#dynamiclink-LG-VAR').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(VAR);

});

code actuel :



<script language="javascript">

 

///ok associer unz classe

//https://jsfiddle.net/Leecj5pr/

//http://jsfiddle.net/sachin377/QQpdL/4/

var g = $('.lightgallery-owl');

var gallery = g.lightGallery({

            selector: '.item-lightbox'

});

$('#dynamiclink-LG-0').on('click', function(){

    $('.item-lightbox').trigger('click');

});

$('#dynamiclink-LG-1').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(1);

});

$('#dynamiclink-LG-2').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(2);

});

$('#dynamiclink-LG-3').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(3);

});

$('#dynamiclink-LG-4').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(4);

});

$('#dynamiclink-LG-5').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(5);

});

$('#dynamiclink-LG-6').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(6);

});

$('#dynamiclink-LG-7').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(7);

});

$('#dynamiclink-LG-8').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(8);

});

$('#dynamiclink-LG-9').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(9);

});

$('#dynamiclink-LG-10').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(10);

});

$('#dynamiclink-LG-11').on('click', function(){

    $('.item-lightbox').trigger('click');

    gallery.data('lightGallery').slide(11);

});

//etc; ... créer un array ou autre

 

</script>

Afficher la suite

Votre réponse

Répondre au sujet

4 réponses

Signaler Commenter la réponse de jordane45

jordane45 22901 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 20 octobre 2018 Dernière intervention - 8 juin 2016 à 12:02

0

Merci

Bonjour,

Actuellement tu cibles les élements via leur ID....
Mets leur une CLASS (même fictive tu t'en moques.. c'est juste pour servir d'identificateur)

par exemple :

 <input id='toto1' class='majolieclassfictive' type='text'>
 <input id='toto2' class='majolieclassfictive' type='text'>
 <input id='toto3' class='majolieclassfictive' type='text'>

$('.majolieclassfictive').on('click', function(){
   var id = $(this).id;
   alert(' ID : '+id);  
});

Signaler Commenter la réponse de lhorn

lhorn - 8 juin 2016 à 14:46

0

Merci

Tout d'abord merci de t'intéresser à mon problème.

Je me rends compte que je n'ai pas posé le contexte:
j'utilise le plugin lightgallery ( http://sachinchoolur.github.io/lightGallery/) qui créé une gallery dans une modale lorsque l'on clique sur un thumbnail de cette gallerie.

Mais Je voudrais en plus de cela que, si je clique sur un certain type de liens lien de ma page, que ce lien ouvre la lightgallery directement à la bonne slide.

pour cela il faut que j'utilise un trigger :
dans mon exemple :

$('.item-lightbox').trigger('click');
    gallery.data('lightGallery').slide(1);

où .item-lightbox est la classe de l'item de mon carousel. et .slide(X); permet de cibler la position de la slide dans la gallery . c'est à dire gallery.data('lightGallery')..slide(0) va cibler la première item, gallery.data('lightGallery')..slide(1) va cibler la deuxième item etc

pour ce qui est du ciblage effectivement je veux que si on clic sur un bouton de visionnage d'une slide spécifique, elle ouvre la slide attitrée. d'ou l'utilisation d'un identifiant numeroté où le numéro correspondrait à la position de la slide.

d'où mon code

$('#dynamiclink-LG-X').on('click', function(){
    $('.item-lightbox').trigger('click');
    gallery.data('lightGallery').slide(X);
});

où X est un nombre entier >ou égal à 0.

Signaler Commenter la réponse de jordane45

jordane45 22901 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 20 octobre 2018 Dernière intervention - 8 juin 2016 à 16:51

Et bien .. tu avais suffisamment expliqué ton besoin dès le départ je te rassure.
Et la réponse que je t'ai donné... est bien conforme à ce que tu demandes.

Signaler Commenter la réponse de cs_AccessToYou

cs_AccessToYou 34 Messages postés mardi 21 novembre 2000Date d'inscription 16 juin 2016 Dernière intervention - Modifié par cs_AccessToYou le 15/06/2016 à 04:12

0

Merci

$('[id^="dynamiclink-LG"]').on('click', function(){

$('.item-lightbox').trigger('click');
gallery.data('lightGallery').slide(parseInt(this.id.match(/\d+$/)));

});

^TdjProg;

Votre réponse

Répondre au sujet

Posez votre question

Answer 1

Comment optimiser ce code s'il vous plait ?

Votre réponse

Votre réponse

Votre réponse

Vous n'êtes pas encore membre ? inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !