CODEWITHSUNDEEP
phpjquerywordpress
edoher
edoher

Reputation: 61

Wordpress Jquery Cycle2 plugin not working

I am using Cycle2 plugin in my Wordpress homepage, but it won't work. First I tried using the class "cycle-slideshow", but I only get this on the console log:

[cycle2] --c2 init--

Now I'm trying to use the API, but still only get the log message, no slider. This is my code:

<script type="text/javascript">
            jQuery(document).ready(function(){
                jQuery( '#home_slider' ).cycle();
            });
            </script>

            <div id='home_slider'>
                                <div class='home_slide'>
                    <div class='slide_tit'>Proyectos</div>
                    <div class='slide_resumen'>Esta es la descripcion</div>
                    <img src='http://localhost/laben/wp-content/uploads/2013/05/header03.jpg'/>
                </div>
                            <div class='home_slide'>
                    <div class='slide_tit'>Investigación</div>
                    <div class='slide_resumen'>Las principales Áreas de Investigación del Laboratorio de Envases de la Universidad de Santiago de Chile están relacionadas con Envases Activos, Interacción Envase/Alimento, Nanotecnología y Envases Biodegradables. Es preciso indicar que todas estas no son áreas independientes sino más bien áreas que se complementan totalmente entre sí.</div>
                    <img src='http://localhost/laben/wp-content/uploads/2013/05/header01.jpg'/>
                </div>
                            <div class='home_slide'>
                    <div class='slide_tit'>Servicios</div>
                    <div class='slide_resumen'>Esta es la descripcion</div>
                    <img src='http://localhost/laben/wp-content/uploads/2013/05/header02.jpg'/>
                </div>

Upvotes: 1

Views: 1873

Answers (2)

Vimal Saifudin
Vimal Saifudin

Reputation: 1845

functions.php

wp_enqueue_script( 'twentyseventeen-global', get_theme_file_uri( '/assets/js/global.js' ), array( 'jquery' ), '1.0', true );

js

<script type="text/javascript">
$(document).ready(function(){
$('#slider').cycle({
    slides: '.article',
    fx: 'scrollHorz'
});
</script>

Upvotes: 0

edoher
edoher

Reputation: 61

Fixed it. It supports images by default, so to make a slider out of other elements needs to be specified a selector:

<script type="text/javascript">
jQuery(document).ready(function(){
    jQuery( '#home_slider' ).cycle({ slides: '.home_slide' });
});
</script>

Upvotes: 5

Related Questions