Stanisław Szewczyk
Stanisław Szewczyk

Reputation: 105

TypeError: jQuery("#slider-full").revolution is not a function

Hi when I install worpdress and template with slider in console I got this error: TypeError: jQuery("#slider-full").revolution is not a function. (In 'jQuery("#slider-full").revolution', 'jQuery("#slider-full").revolution' is undefined) What should I do now?

jQuery("#slider-full").revolution({
    sliderType:"standard",
    sliderLayout:"fullscreen",
    dottedOverlay:"none",
    delay:9000,
    navigation: {
        keyboardNavigation:"off",
        keyboard_direction: "horizontal",
        mouseScrollNavigation:"off",
        onHoverStop:"off",
        touch:{
            touchenabled:"on",
            swipe_threshold: 75,
            swipe_min_touches: 50,
            swipe_direction: "horizontal",
            drag_block_vertical: false
        }
        ,
        arrows: {
            style:"",
            enable:true,
            hide_onmobile:false,
            hide_onleave:true,
            hide_delay:200,
            hide_delay_mobile:1200,
            tmp:'',
            left: {
                h_align:"left",
                v_align:"center",
                h_offset:20,
                v_offset:0
            },
            right: {
                h_align:"right",
                v_align:"center",
                h_offset:20,
                v_offset:0
            }
        }
        ,
        bullets: {
            enable:true,
            hide_onmobile:true,
            hide_under:769,
            style:"",
            hide_onleave:false,
            direction:"horizontal",
            h_align:"right",
            v_align:"top",
            h_offset:60,
            v_offset:40,
            space:5,
            tmp:'<span class="tp-bullet-image"></span><span class="tp-bullet-title"></span>'
        }
    },
    responsiveLevels:[1240,1024,778,480],
    visibilityLevels:[1240,1024,778,480],
    gridwidth:[1240,1024,778,480],
    gridheight:[868,768,960,720],
    lazyType:"none",
    parallax: {
        type:"scroll",
        origo:"slidercenter",
        speed:400,
        levels:[5,10,15,20,25,30,35,40,45,46,47,48,49,50,51,55],
        type:"scroll",
    },
    shadow:0,
    spinner:"spinner2",
    stopLoop:"off",
    stopAfterLoops:-1,
    stopAtSlide:-1,
    shuffle:"off",
    autoHeight:"off",
    fullScreenAutoWidth:"off",
    fullScreenAlignForce:"off",
    fullScreenOffsetContainer: "",
    fullScreenOffset: "",
    disableProgressBar:"on",
    hideThumbsOnMobile:"off",
    hideSliderAtLimit:0,
    hideCaptionAtLimit:0,
    hideAllCaptionAtLilmit:0,
    debugMode:false,
    fallbacks: {
        simplifyAll:"off",
        nextSlideOnWindowFocus:"off",
        disableFocusListener:false,
    }
});

Upvotes: 0

Views: 7454

Answers (3)

B.K
B.K

Reputation: 897

I had a similar issue and in my case, it was being caused by including jQuery twice.

Make sure that you have not included jQuery twice. Check all the scripts that are included on your page and ensure that none of them is including jquery already.

As an example in Laravel, a jquery library is already in public/js/app.js if you add a theme to your Laravel installation the theme might come with its jQuery library for use on some pages. Just make sure that when you are integrating your theme into your Laravel app you include one jQuery.

Upvotes: 0

pgk
pgk

Reputation: 1477

This means that your RevolutionSlider is not properly included into the page or it is included after the point at which it is called.

You must check in admin panel if this plugin is installed and turned on successfully.

If yes, you can try to run jQuery("#slider-full").revolution({}); in your console to check if slider is not included later in the code;

Upvotes: 2

Mahmoud Turki
Mahmoud Turki

Reputation: 107

do this :

declare var jQuery: any;

instead of :

import $ as jquery

and use ngAfterViewInit

finally

jQuery(this.rev_slider.nativeElement).show().revolution(RevSliderConfig)

RevSliderConfig is the object of config

rev_slider is the id of the rev slider in html using ViewChild

Upvotes: 1

Related Questions