Discussion :

[kate59]

Bonjour,

voila ma pagination ne fonctionne pas je pense du a mon url avec du GET chambres.php?chambre=paul

voici le html

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div class="wrapper">
 
 
            <div class="jcarousel-wrapper">
                <div class="jcarousel">
                    <ul>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 1"></li>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 2"></li>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 3"></li>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 4"></li>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 5"></li>
                        <li><img src="images/chambre-paul-1.jpg" alt="Image 6"></li>
                    </ul>
                </div>
 
                <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
                <a href="#" class="jcarousel-control-next">&rsaquo;</a>
 
                <p class="jcarousel-pagination"></p>
            </div>
        </div>

et le code js:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
(function($) {
    $(function() {
        var jcarousel = $('.jcarousel');
 
        jcarousel
            .on('jcarousel:reload jcarousel:create', function () {
                var carousel = $(this),
                    width = carousel.innerWidth();
 
                if (width >= 600) {
                    width = width / 3;
                } else if (width >= 350) {
                    width = width / 2;
                }
 
                carousel.jcarousel('items').css('width', Math.ceil(width) + 'px');
            })
            .jcarousel({
                wrap: 'circular'
            });
 
        $('.jcarousel-control-prev')
            .jcarouselControl({
                target: '-=1'
            });
 
        $('.jcarousel-control-next')
            .jcarouselControl({
                target: '+=1'
            });
 
        $('.jcarousel-pagination')
            .on('jcarouselpagination:active', 'a', function() {
                $(this).addClass('active');
            })
            .on('jcarouselpagination:inactive', 'a', function() {
                $(this).removeClass('active');
            })
            .on('click', function(e) {
                e.preventDefault();
            })
            .jcarouselPagination({
                perPage: 1,
                item: function(page) {
                    return '<a href="#' + page + '">' + page + '</a>';
                }
            });
    });
})(jQuery);

merci.

[Invité]

Bonjour,

Dire "ça marche pas" ou "ça ne fonctionne pas" ne sert à rien.

On ne va pas faire le travail à ta place.

1/ A TOI de faire un débogage de base, en mettant des alert() dans ton code JavaScript, pour afficher/vérifier les données, et voir à quel endroit ça bug.

2/ Tu peux inspecter le code (et les erreurs) via la touche "F12" du clavier -> "console" -> "erreurs"

3/ D'autre part (et avant tout), il existe une doc :

• jCarousel documentation : Pagination Plugin

[kate59]

j'avais regarder la docs et
j'ai fait cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
     .jcarouselPagination({
                perPage: 1,
                item: function(page) {
                    return '<a href="/#' + page + '">' + page + '</a>';
 
                }
            });

et ajouter ceci :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
       <a href="monsite.fr?id=1/#" class="jcarousel-control-prev">&lsaquo;</a>
                <a href="monsite.fr?id=1/#" class="jcarousel-control-next">&rsaquo;</a>

maiS le carrousel ne tourne pas.
merci