SIDE NAVIGATION not working due to i have SLIDER REVOLUTION 5.x SCRIPTS

SstephnisimSep 28, 2019

Hi Canvas Support,

My side navigation is not working due to i have another scripts (slider revolution 5.x scripts) below "footer". May i know which code to edit for it to work?

Because it's now work only if i use slider revolution scripts or side navigation scripts.

Thank You!

`
<script src="include/rs-plugin/js/jquery.themepunch.tools.min.js"></script>
<script src="include/rs-plugin/js/jquery.themepunch.revolution.min.js"></script>

&lt;script src="include/rs-plugin/js/extensions/revolution.extension.slideanims.min.js"&gt;&lt;/script&gt;
&lt;script src="include/rs-plugin/js/extensions/revolution.extension.layeranimation.min.js"&gt;&lt;/script&gt;
&lt;script src="include/rs-plugin/js/extensions/revolution.extension.navigation.min.js"&gt;&lt;/script&gt;

&lt;script&gt;

	var tpj=jQuery;
	tpj.noConflict();

	tpj(document).ready(function() {

		var apiRevoSlider = tpj('#rev_slider_ishop').show().revolution(
		{
			sliderType:"standard",
			jsFileLocation:"include/rs-plugin/js/",
			sliderLayout:"fullwidth",
			dottedOverlay:"none",
			delay:9000,
			navigation: {},
			responsiveLevels:[1200,992,768,480,320],
			gridwidth:1140,
			gridheight:500,
			lazyType:"none",
			shadow:0,
			spinner:"off",
			autoHeight:"off",
			disableProgressBar:"on",
			hideThumbsOnMobile:"off",
			hideSliderAtLimit:0,
			hideCaptionAtLimit:0,
			hideAllCaptionAtLilmit:0,
			debugMode:false,
			fallbacks: {
				simplifyAll:"off",
				disableFocusListener:false,
			},
			navigation: {
				keyboardNavigation:"off",
				keyboard_direction: "horizontal",
				mouseScrollNavigation:"off",
				onHoverStop:"off",
				touch:{
					touchenabled:"on",
					swipe_threshold: 75,
					swipe_min_touches: 1,
					swipe_direction: "horizontal",
					drag_block_vertical: false
				},
				arrows: {
					style: "ares",
					enable: true,
					hide_onmobile: false,
					hide_onleave: false,
					tmp: '&lt;div class="tp-title-wrap"&gt;	&lt;span class="tp-arr-titleholder"&gt;{{title}}&lt;/span&gt; &lt;/div&gt;',
					left: {
						h_align: "left",
						v_align: "center",
						h_offset: 10,
						v_offset: 0
					},
					right: {
						h_align: "right",
						v_align: "center",
						h_offset: 10,
						v_offset: 0
					}
				}
			}
		});

		apiRevoSlider.bind("revolution.slide.onloaded",function (e) {
			SEMICOLON.slider.sliderParallaxDimensions();
		});

	}); //ready

&lt;/script&gt;
        
&lt;script&gt;
$(function() {
	$( "#side-navigation" ).tabs({ show: { effect: "fade", duration: 400 } });
});

</script>

</body>
</html>

SSemicolon WebSTAFFSep 29, 2019

Hello,

This issue appears to have been caused by a jQuery Conflict. Simply replace the following code on your Page:

$(function() {
$( "#side-navigation" ).tabs({ show: { effect: "fade", duration: 400 } });
});

with the following code:

jQuery(function() {
jQuery( "#side-navigation" ).tabs({ show: { effect: "fade", duration: 400 } });
});

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

SstephnisimOct 2, 2019

Dear Canvas Support,

It works perfectly good on my website after get it change from what you told.

Thank You very much!

All solved!