Fork me on GitHub






Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
Bonjour,
J'utilise le thème xbootstrap, et je souhaiterais modifier le temps d'affichage des images du bandeau.
Ou pourrais-je trouver ou modifier ce paramètre ?
JJDai

Posté le : 29/03 10:59

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Admin Frxoops
Inscrit: 16/05/2003 18:10
De Rhone-Alpes
Messages: 3763
Salut, c'est basé sur bootstrap (https://getbootstrap.com/docs/4.3/components/carousel/)
(version B3 pour xbootstrap).

la doc est ici :
en v4 :https://getbootstrap.com/docs/4.3/components/carousel/

en V3 : https://getbootstrap.com/docs/3.4/javascript/#carousel



<div class="carousel-item" data-interval="2000">
      <
img src="..." class="d-block w-100" alt="...">
    </
div>


C'est le paramètre data-interval="2000" (en ms)

Posté le : 29/03 11:06

Open in new window
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
Il n'y a pas ça dans le thème que j'utilise, je l'aurais vu de suite quand j'ai modifier les images.
Mais je vais l'ajouter pour voir.
JJDai

Posté le : 29/03 11:51

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Admin Frxoops
Inscrit: 16/05/2003 18:10
De Rhone-Alpes
Messages: 3763
Effectivement, après un coup d’œil, ce thème utilise un slide externe à bootstrap, il s'agit de OwlCarousel.

Il utilise /themes/xbootstrap/js/owl/
et il est défini dans le fichier /themes/xbootstrap/tpl/slider.tpl

En regardant les fichiers css de owl,
j'ai peut-être une solution :
Tu ajoutes ceci à xoops.css dans ce thème :
Autoplay.Defaults = {
        
autoplayfalse,
        
autoplayTimeout5000,
        
autoplayHoverPausefalse,
        
autoplaySpeedfalse
    
};
et tu changes autoplayTimout (ici c'est 5s)
C'est bon parce que dans le fichier theme.tpl,
on a
<link href="<{xoImgUrl}>js/owl/assets/owl.carousel.css" rel="stylesheet">
    <
link href="<{xoImgUrl}>js/owl/assets/owl.theme.default.css" rel="stylesheet">

    <
link href="<{$xoops_url}>/favicon.ico" rel="shortcut icon">
    <
link rel="stylesheet" type="text/css" href="<{xoImgUrl}>css/bootstrap.min.css">
    <
link rel="stylesheet" type="text/css" href="<{xoImgUrl}>css/xoops.css">
La définition de xoops.css est après et vient donc écraser celle de owl.

Autre solution plus propre à mon sens : Redéfinir les slides avec les fonctions proposées par b3 (voir mon lien sur mon 1er post) et pas celles de owl.
C'est plus pérenne car on devrait sortir une version xboostrap4...

Posté le : 29/03 12:08

Open in new window
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
oui en changeant intervalle dans js.js ça marche mieux.
Merci.

Posté le : 29/03 12:13

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
ça ne marche pas en modiiant xoops.css pourtant j'ai vidé les caches au cas ou, mais en modifiant interval dans js.js , impeccable :

/* Bootstrap Carousel */
jQuery(document).ready(function($) {
    $(
'.carousel').carousel({
        
interval:   5000,  // JJDai - interval de temps entre chaque image du slider en ms
        
pause:      "hover",
        
wrap:       true
  
})
});

Merci je vais quand même continuer a explorer la piste du CSS
JJDai

Posté le : 29/03 12:20

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Admin Frxoops
Inscrit: 16/05/2003 18:10
De Rhone-Alpes
Messages: 3763
Si tu sais intégrer des variables js dans le html voici la page d'exemple :

https://owlcarousel2.github.io/OwlCarousel2/demos/autoplay.html

Attention, ça c'est la version 2...

Posté le : 29/03 12:49

Open in new window
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
oui c'est une solution aussi,
mais finalement j'en ai trouvé une nettement meilleure.
en fait les utilisateurs souhaitaient pouvoir prendre le temps d'observer les images, que je vais changer régulièrement.
En fait je viens de leur envoyer un message pour leur indiquer qu'en en laissant la souris au survol du slider ils auraient tout le temps de les observer.
Comme quoi les solutions ne sont pas toujours ce que l'on pourrait penser
Mais c'était instructif quand même
JJDai

Posté le : 29/03 13:03

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Admin Frxoops
Inscrit: 16/05/2003 18:10
De Rhone-Alpes
Messages: 3763
lol, ben oui, ça me semblait évident,

c'est la propriété : "pause: "hover","

Posté le : 29/03 14:26

Open in new window
Partager Twitter Partagez cette article sur GG+
Re: Slider xbootstrap
Team FrXoops
Inscrit: 14/05/2004 22:32
Messages: 2189
Oui bin heueueue !!!
Mes petites cellules grises ne sont plus aussi vaillantes .
JJDai

Posté le : 29/03 17:17

Ne pas perdre patience, même si cela semble impossible, c'est déjà de la patience.
Origami
Pli'Art Origami
[url=http://mfpp-origami.fr]Mouvement Français des Plieurs de Papie...
Partager Twitter Partagez cette article sur GG+

 Haut   Précédent   Suivant




Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

23 Personne(s) en ligne (7 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 23 | Plus ...