WordPress.org

Ready to get started?Download WordPress

Forums

vertical auto stepping/scrolling (5 posts)

  1. nathan12343
    Member
    Posted 3 years ago #

    This is a bit of a long shot...

    I'm using a hacked version of wp-featured-content-slider to put some featured content onto my homepage. This uses left/right buttons to navigate through divs of content. I would like to be able to automatically step from one to the next after a given time period.

    Can anyone help?

    Here is the output code:

    <script type="text/javascript">
    stepcarousel.setup({
    	galleryid: 'mygallery', //id of carousel DIV
    	beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
    	panelclass: 'panel', //class of panel DIVs each holding content
    	panelbehavior: {speed:500, wraparound:true, persist:true},
    	defaultbuttons: {enable: true, moveby: 1, leftnav: ['http://www.pinks-and-green.com/wp-content/plugins/wp-featured-content-slider/eps2.png', 0, 250], rightnav: ['http://www.pinks-and-green.com/wp-content/plugins/wp-featured-content-slider/eps1.png', -65, 250]},
    	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
    	contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']
    })
    </script>
    
    <div id="slider">
    
    <div id="mygallery" class="stepcarousel">
    <div class="belt">
    
    <div class="panel" style="background:url(http://www.pinks-and-green.com/wp-content/uploads/2010/08/kitchen_slider1.jpg)">	
    
    <h2><a href="http://www.pinks-and-green.com/kitchen-fun/" title="Kitchen fun">Kitchen fun</a></h2>
    <h3> <p> A whole new range of mouthwateringly beautiful kitchen products.</p>
    </h3>
    </div>
    
    <div class="panel" style="background:url(http://www.pinks-and-green.com/wp-content/uploads/2010/08/cookies.png)">	
    
    <h2><a href="http://www.pinks-and-green.com/hello-world/" title="Crumbs!">Crumbs!</a></h2>
    <h3> <p>This might be a little of track, but we just had to share this, the world’s greatest, most delicious, ultimate cookie recipe!!</p>
    </h3>
    </div>
    
    </div>
    </div>
    </div>
  2. MACscr
    Member
    Posted 3 years ago #

    Did you ever figure this out?

  3. MACscr
    Member
    Posted 3 years ago #

    I actually figured it out. Either its the same author as this script or that person copied it. Anyway, just copy the contents of the js file located on the following page and then add the autostep setting to your inline js.

    http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm

  4. Dan Mensinger
    Member
    Posted 3 years ago #

    Autostep wouldnt work for me until I also updated the slider.js file located in the Scripts directory with the stepcarousel.js (v.1.9) code on the link MACscr supplied above.

    It's the same code, the author must have just renamed the stepcarousel.js to slider.js for the plugin. But you need the latest version for autostep to work.

  5. nathan12343
    Member
    Posted 3 years ago #

    Genius! Works like an absolute charm.

Topic Closed

This topic has been closed to new replies.

About this Topic