18041 sujets

Questions générales et questions de débutants

[Résolu] Slider en PHP, comment retirer l'effet fondu entre 2 slide

Bonjour à tous,

J'ai installer un thème wordpres dans lequel il y a un slider.
Par contre j'aimerai retirer l'effet fondu qu'il y a entre 2 slides. Je suis assez novice en php, quelqu'un pourrait me dire où trouver cette fonctionnalité ?

Merci d'avance,

Voici une partie du code qu'il y a dans index.php 

<div id="slideshow">

                        <?php

                        $slider_arr = array();

                        $args = array(

                                     //'category_name' => 'blog',

                                     'post_type' => 'post',

                                     'meta_key' => 'ex_show_in_slideshow',

                                     'meta_value' => 'Yes',

                                     'posts_per_page' => 10

                                     //'paged' => ( get_query_var('paged') ? get_query_var('paged') : 1),

                                     );

                        query_posts($args);

                        $y = 0;

                        while (have_posts()) : the_post(); ?>

                        

                        <?php if($y == 0) { ?>

                          <a href="<?php the_permalink(); ?>" class="active">

                        <?php } else { ?>

                          <a href="<?php the_permalink(); ?>">

                        <?php } ?>

                        

                        <?php the_post_thumbnail('featured-slideshow',array('alt' => '', 'class' => 'slide_img', 'title' => '')); ?></a>

                        

                        <?php array_push($slider_arr,get_the_ID()); ?>

                        <?php $y++; ?>

                        <?php endwhile; ?>

                        <?php wp_reset_query(); ?>

                    </div>
Bonjour.

Il s'agit plus probably d'un paramètre à modifier en javascript (pitêtre Jquery). Donc à voir plutôt de côté là.
Merci de votre réponse, mais dans ce thème il n'y a que des images et des fichiers .php, et .css ... aucun javascript, ni jquery. Où puis-je trouver la solution à ma question ?

Merci d'avance
Il peut éventuellement s'agir d'un effet de transition en css3, mais vu les problèmes de compatibilité il s'agit certainement d'un javascript, sans doute avec jQuery. En tout cas, absolument pas en php.
D'accord, merci. Mais où est-ce que je peux modifier cela ?! Je n'ai pas un seul fichier javascript dans ce thème ...
Bonjour,

cherche toutes les occurrences du terme script dans tes fichiers : il est possible que ton thème utilise les javascript utilisés par l'administration de WordPress, auquel cas tu en trouveras une trace sous la forme de "wp_enqueue_script" très probablement. Il est également possible que le javascript soit présent dans une simple balise <script></script>, dans le header.php, footer.php ou encore functions.php.

Reviens par ici quand tu auras trouvé une piste Smiley cligne
cherry a écrit :
Voici le lien du thème en question : http://www.dessign.net/phototheme/

Ce thème très mal conçu appelle deux fois la bibliothèque jQuery dans la même page, dans deux versions différentes (v1.6.3 via Googleapsis, et v1.7.2)...

Il injecte aussi le script qui nous intéresse directement dans la page, voici le code :


  <script type="text/javascript">
    var intervalID;
    function slideSwitch() {
        var $active = $('#slideshow a.active');
        if ( $active.length == 0 ) $active = $('#slideshow a:last');
        var $next =  $active.next().length ? $active.next()
            : $('#slideshow a:first');
        $active.addClass('last-active');
        $next.css({opacity: 0.0})
            .addClass('active')
            .animate({opacity: 1.0}, 1000, function() {
                $active.removeClass('active last-active');
            });
        clearInterval(intervalID);
        intervalID = setInterval( "slideSwitch()", 5000 );
    }
    function slideSwitch_prev() {
        var $active = $('#slideshow a.active');
        if ( $active.length == 0 ) $active = $('#slideshow a:first');
        var $next =  $active.prev().length ? $active.prev() : $('#slideshow a:last');
        $active.addClass('last-active');
        $next.css({opacity: 0.0})
            .addClass('active')
            .animate({opacity: 1.0}, 1000, function() {
                $active.removeClass('active last-active');
            });
        clearInterval(intervalID);
        intervalID = setInterval( "slideSwitch()", 5000 );
    }    
    $(function() {
        intervalID = setInterval( "slideSwitch()", 5000 );
    });
  </script>

Donc, je ne sais pas trop... souvent les sliders ont une fonctions "fade" pour contrôler cet effet... ici je jouerais bien sur une valeur "opacity": de placer cette ligne :
$next.css({opacity: 0.0})

à :
$next.css({opacity: 1.0})

... pour voir. Le mieux étant de supprimer purement et simplement toute la partie du code concerné, mais je n'ai pas testé.
Oui, en effet Olivier, c'est bien vu : l'effet de transition se fait ici :


$next.css({opacity: 0.0})
            .addClass('active')
            .animate({opacity: 1.0}, 1000, function() {
                $active.removeClass('active last-active');
            });


On part d'un opacité nulle (transparent donc) et on passe, grâce à la fonction animate, à une opacité totale (image normale donc) en 1000ms (en 1 seconde donc). Supprimer le "animate" pose le problème de zapper la fonction de callback de fin d'animation.

Je n'ai pas testé, mais je pense qu'il faut compléter le code d'Olivier comme suit :

$next.css({opacity: 1.0}).addClass('active');
$active.removeClass('active last-active');

Modifié par petibato (12 Sep 2013 - 12:23)
merci beaucoup pour vos réponses, et je risque de vous paraître un peu (trop) débutant, mais où est-ce que je dois changer ce code ? Dans lequel des fichiers du thèmes l'avez-vous trouvé ?

merci d'avance pour votre aide !
Trouvé !! Il était dans le header ! Je teste vos modifications dès ce soir et re-viendrais pour marquer le sujet comme résolu à ce moment.

En tout merci beaucoup de votre aide !!
Sujet clos
Aller à