Results 1 to 4 of 4

Thread: Step Carousel working with mouse over ?

  1. #1
    Join Date
    Mar 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Step Carousel working with mouse over ?

    1) Script Title: Step Carousel

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...epcarousel.htm

    3) Describe problem:

    Step Carousel is working just perfect

    But how to make it to work even with Mouse over it ?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,167
    Thanks
    44
    Thanked 3,240 Times in 3,201 Posts
    Blog Entries
    12

    Default

    The idea is that if the mouse moves over the carousel it pauses, so that if a panel is linked or has an onpanelclick behavior, it can more easily be clicked on.

    That said, you can disable this feature by commenting out this section of the code (around line #114):

    Code:
    			/* $carouselparts.hover(function(){ //onMouseover
    				stepcarousel.stopautostep(config)
    				config.autostep.hoverstate="over"
    			}, function(){ //onMouseout
    				if (config.steptimer && config.autostep.hoverstate=="over" && config.autostep.status!="stopped"){
    					config.steptimer=setInterval(function(){stepcarousel.autorotate(config.galleryid)}, config.autostep.pause)
    					config.autostep.hoverstate="out"
    				}
    			}) */
    Using a text only editor like NotePad, add the highlighted comment tokens as shown. If you have no links or onpanelclick behavior(s), there should be no problem with doing it this way. If you do though, it will be hard for the user to click on a panel as it might move out from under the mouse before they can click it.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    borislav123 (03-28-2012)

  4. #3
    Join Date
    Mar 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you, jscheuer1

    I really thank you!

    and a final question - is it possible it to rotates pictures with no stop at the end - to rotate it forever?

    I read the documentation but I'm not sure what and where to do?

    Thanx again in advance! :-)

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,167
    Thanks
    44
    Thanked 3,240 Times in 3,201 Posts
    Blog Entries
    12

    Default

    You have to have autostep enabled of course, and contrary to what it says on the demo page:

    autostep: {enable:true, moveby:1, pause:3000}

    v1.6 parameter Set this parameter to auto rotate the panels, specifying the number of panels to move each time, and pause between rotating. Note that during auto rotation, moving the mouse over the Carousel or the default buttons (if enabled) pauses it, while moving your mouse out resumes it again. Clicking on the Carousel stops auto rotation altogether. This parameter has 3 properties:
    1. enable: Boolean (true/ false) setting on whether to enable auto rotation.
    2. moveby: Number of panels to move by each time. Negative number moves panels backwards instead.
    3. pause: Pause between rotation in milliseconds.


    Note that if autostep is enabled, this automatically sets "panelbehavior.wraparound:true" as well.
    The wraparound must be set to true, example on page setup call:

    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
    	autostep: {enable:true, moveby:1, pause: 3000},
    	panelbehavior: {speed:500, wraparound:true, wrapbehavior:'slide', persist:false},
    	defaultbuttons: {enable: true, moveby: 1, leftnav: ['10/leftnav.gif', -5, 80], rightnav: ['10/rightnav.gif', -20, 80]},
    	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
    	contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
    })
    
    </script>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •