Need smooth transition with ELITE slider

[Koichiro Ikawa]

Hi, I am now developing an online shop using ELITE theme. Everything looks fine except for the full screen slider transition speed. Default transition speed is set to 750 in custom-js.php. I attempted to change the transition speed to 2000 on Hero Section of Theme Options page, but the transition speed stays unchanged (still 750). Slide duration (5000) changes when I update it on Hero Section.

I attempted to change 750 to 2000 in custom-js.php, but that did not work… Is there a way to change the transition speed to make the image switch over a bit smoother ?

Thanks in advance for your support.

[Bill Robbins]

I’d be glad to take a look for you. What’s the url to the page where you’re trying to change the slider speed?

Thanks,
Bill

[Koichiro Ikawa]

Thanks for the quick reply. I am still working in local environment (= not public yet). If you need to see the actual image switch over of my site, then probably I will complete the site quickly and get the url to you ? I was just wondering if the JS script for transition speed not functioning simply because the slide duration changes as I update it on Hero Section.

Koichiro

[Bill Robbins]

Good Morning Koichiro,

Local development is great so no worries there. It looks like one of the options in with the slideshow script changed names and that’s impacting the ability to set how long a transition is between slides.

In the custom-js.php file, look for this section:

	jQuery(window).load(function() {
		jQuery('.flexslider').flexslider({
			animation           :	"fade",
			slideshow           :	<?php echo of_get_option('auto','true') ?>,
			slideshowSpeed      :	<?php echo of_get_option('duration','5000') ?>, 
			animationDuration   	:	<?php echo of_get_option('transition','750') ?>,
			controlNav          :	false,
			directionNav        :   <?php echo of_get_option('prev_next','true') ?>,
			prevText		:	"",
			nextText		:	"", 
			pauseOnAction       :   true,
			pauseOnHover        :	false,
			useCSS			:	true,
			video			:	true,
			smoothHeight		:	true,
			controlsContainer	:	".slider-nav",
			start				:	function(slider){
			  			jQuery('body').removeClass('loading');
			}
		});
	});

and replace it with this:

(See the support site for the code to use.)

Then save your changes. When I tested that locally just now, it appeared to do the trick.

Hope that helps out. Let me know if you still have trouble.

Take care,
Bill

[Koichiro Ikawa]

Hi, Bill, thanks a lot. This solved the problem ! I just updated custom-js.php in the parent theme (ELITE), hoping you will be updating ELITE theme reflecting this change. Or should the update be done in the child theme, keeping the original custom-js.php as is in ELITE ?

Thanks again…

Koichiro

[Bill Robbins]

Hi Koichiro, I’m glad to hear that did the trick. You can keep the change in the parent theme as I’ve already added the code to go out in the next update to Elite. Thanks for spotting the bug there for me.

If I can help with anything else, just let me know.

Thanks,
Bill

[Koichiro Ikawa]

Wow, you are so quick in responce. Super helpful. I am glad that I have chosen OrganizedThemes.

Many thanks again.

Koichiro

[Author]

Posts