Jump to content


Photo

Auto-Carousel rotate (slow down)


  • Please log in to reply
12 replies to this topic

#1 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 24 February 2011 - 01:25 AM

Hi,

I am stuck as to what to change in the "section.carousel.php" to get the carousel animation to slow down.

thehungryhousewives

I have modified the code as follows to get the carousel to auto-rotate but is this the slowest setting for the carousel?

"animation: 'slow',"

 function section_head() {   ?>
			<script type="text/javascript">
			/* <![CDATA[ */
			var $j = jQuery.noConflict();
	
			function mycarousel_initCallback(carousel)
			{
			    // Disable autoscrolling if the user clicks the prev or next button.
			    carousel.buttonNext.bind('click', function() {
			        carousel.startAuto(0);
			    });
	
			    carousel.buttonPrev.bind('click', function() {
			        carousel.startAuto(0);
			    });
	
			    // Pause autoscrolling if the user moves with the cursor over the clip.
			    carousel.clip.hover(function() {
			        carousel.stopAuto();
			    }, function() {
			        carousel.startAuto();
			    });
			};
	
			$j(document).ready(function () {
			    $j(".thecarousel").show();
				$j(".thecarousel").jcarousel({
					wrap: 'circular',
					visible: <?php e_pagelines('carousel_display_items', 9); ?>,
					easing: 'swing',
					scroll: <?php e_pagelines('carousel_scroll_items', 6); ?>,
					animation: 'slow',
					initCallback: mycarousel_initCallback,
					auto: 2
	
				});
			});
			/* ]]> */
			</script>
	
		<?php }
	
		function section_scripts() {
	
			return array(
					'jcarousel' => array(
							'file' => $this->base_url . '/carousel.jcarousel.js',
							'dependancy' => array('jquery'),
							'location' => 'footer'
						)
	
				);
	
		}


#2 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 24 February 2011 - 02:36 AM

Let me get a developer to have a look at this. Thanks, Bryan

#3 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts
  • LocationSan Francisco, CA
  • Framework Version:2.3
  • Country: Country Flag

Posted 24 February 2011 - 02:39 AM

We've added an option for this in 1.3 :) Animation Speed.

#4 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 28 February 2011 - 04:15 AM

Thanks Andrew but I couldn't get the carousel to auto rotate with the stock code, so I modified the .php file to the below code and the carousel disappears. I'm certain the:
initCallback: mycarousel_initCallback,
auto: 2

portion of the code is the culprit. But even if I take those 2 lines out I can't get the carousel to auto start. I'm thinking those 2 lines of code run the function to start the auto-rotation.
BTW I do like the animation_speed portion of code though.

 function section_head() {
			$carousel_items = (pagelines_option('carousel_display_items')) ? pagelines_option('carousel_display_items'): 6;
			$carousel_scroll_items = (pagelines_option('carousel_scroll_items')) ? pagelines_option('carousel_scroll_items'): 3;
			$animation_speed = (pagelines_option('carousel_animation_speed')) ? pagelines_option('carousel_animation_speed'): 2500;
			?>
		<script type="text/javascript">
		/* <![CDATA[ */
		var $j = jQuery.noConflict();
	
			function mycarousel_initCallback(carousel)
			{
			    // Disable autoscrolling if the user clicks the prev or next button.
			    carousel.buttonNext.bind('click', function() {
			        carousel.startAuto(0);
			    });
			    carousel.buttonPrev.bind('click', function() {
			        carousel.startAuto(0);
			    });
			    // Pause autoscrolling if the user moves with the cursor over the clip.
			    carousel.clip.hover(function() {
			        carousel.stopAuto();
			    }, function() {
			        carousel.startAuto();
			    });
			};
	
			$j(document).ready(function () {
		    $j(".thecarousel").show();
			$j(".thecarousel").jcarousel({
				wrap: 'circular',
				visible: <?php echo $carousel_items; ?>,
				easing: 'swing',
				scroll: <?php echo $carousel_scroll_items; ?>,
				animation: <?php echo $animation_speed; ?>
				initCallback: mycarousel_initCallback,
				auto: 2
			});
		});
		/* ]]> */
		</script>
		<?php }


#5 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts
  • LocationSan Francisco, CA
  • Framework Version:2.3
  • Country: Country Flag

Posted 28 February 2011 - 04:41 AM

well, what's your question here then? I can't possibly debug your code, as I don't know what's going on with the callback and your server.

#6 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 28 February 2011 - 05:54 AM

I was just wondering how to get the auto-rotate to work with the new animation_speed functionality? I'm not even sure what initCallback does?

#7 Guest_Guest_*

Guest_Guest_*
  • Guests

Posted 28 February 2011 - 06:51 AM

Marked for continued developer support.

#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 28 February 2011 - 07:33 PM

Alisa, Let's clear this up...is the auto-scroll working? Is the animation option working? They are the same option and that's why I think there is some confusion here.

#9 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 01 March 2011 - 05:27 AM

Adam,
The auto-scroll is working but if you look at the site: thehungryhousewives
The animation is too fast. I have the animation_speed set at 2500 which should mean that the animation should take a total of 2.5 seconds to complete. You will notice it is much faster. I can get the animation_speed to take on the set speed if I manually click the navleft or navright buttons.
Maybe I am confused and the animation speeds can't be altered but I was hoping to get the auto-scroll option to slow down the times between scrolling and the scroll speed.
Maybe I am being too picky here but the more options that can be changed the more unique a site can be from another.

Thanks for all the help and I hope I am not being too annoying.

#10 Kate

Kate

    Advocate

  • Members
  • 3039 posts

Posted 01 March 2011 - 12:39 PM

Hey Alisa - Did you consider updating to 1.3? As Andrew said, this is an option that was added...

#11 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 02 March 2011 - 03:56 AM

Kate, I did update to v1.3.0.1 and the above code was what I modified. I also went into the settings for the carousel and changed the animation speed there but when I looked at the "section.carousel.php" it was not updated. I'm not too savvy on what a callback is on a server as Andrew stated but I know that portion of code I modified helped with making the carousel auto-rotate. Now that it is an option I thought I could get rid of that code but the carousel didn't start with the stock code.

#12 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 02 March 2011 - 08:13 PM

If the modification was in the base theme then updates to the core would still be secondary to whatever mod you made. At any rate you can email me adam [at] pagelines.com if you need further assistance. I'll take a look at what you have and see if the auto-scroll option happens to be broken.

#13 thehungryhousewives

thehungryhousewives

    Member

  • Members
  • PipPip
  • 10 posts

Posted 06 March 2011 - 04:36 AM

Thanks Adam but I figured this out.

All I needed was an integer instead of a string.

Original code:
 animation: <?php echo $animation_speed; ?>

Modified code:
 animation: 2000,

This slowed the auto-scroll carousel so now it takes 2 seconds to complete the scroll. This is a much improved speed for our animation, not saying this is for every website but with the test audience we had this is a lot better.