WordPress.org

Ready to get started?Download WordPress

Forums

Wp Carousel - Multiple Rows HELP!! (2 posts)

  1. clairegriffin
    Member
    Posted 3 years ago #

    Hi there,

    I am using the WP Carousel plugin to display posts on my home page.
    At the moment it is displaying 3 in a row.

    What I would love to do is 6, i.e 2 rows of three.

    I'm guessing I need to manipulate this code in the step carousel js file to change the top position but I'm not sure what logic I need to preserve the flow of the carosuel,

    config.$panels.each(function(index){ //loop through panels
    
    			var $currentpanel=$(this)
    
    			$currentpanel.css({float: 'left', position: 'absolute',top:paneltop+'px', left: paneloffset+'px'}) //position panel
    			$currentpanel.bind('click', function(e){return config.onpanelclick(e.target)}) //bind onpanelclick() to onclick event
    			paneloffset+=stepcarousel.getCSSValue($currentpanel.css('marginRight')) + parseInt($currentpanel.get(0).offsetWidth || $currentpanel.css('width')) //calculate next panel offset
    			config.paneloffsets.push(paneloffset) //remember this offset
    			config.panelwidths.push(paneloffset-config.paneloffsets[config.paneloffsets.length-2]) //remember panel width
    		})
    		config.paneloffsets.pop() //delete last offset (redundant)
    		var addpanelwidths=0
    		var lastpanelindex=config.$panels.length-1
    		config.lastvisiblepanel=lastpanelindex
    		for (var i=config.$panels.length-1; i>=0; i--){
    			addpanelwidths+=(i==lastpanelindex? config.panelwidths[lastpanelindex] : config.paneloffsets[i+1]-config.paneloffsets[i])
    			if (config.gallerywidth>addpanelwidths){
    				config.lastvisiblepanel=i //calculate index of panel that when in 1st position reveals the very last panel all at once based on gallery width
    			}
    		}
    		config.$belt.css({width: paneloffset+'px'}) //Set Belt DIV to total panels' widths
    		config.currentpanel=(config.panelbehavior.persist)? parseInt(this.getCookie(config.galleryid+"persist")) : 0 //determine 1st panel to show by default
    		config.currentpanel=(typeof config.currentpanel=="number" && config.currentpanel<config.$panels.length)? config.currentpanel : 0
    		var endpoint=config.paneloffsets[config.currentpanel]+(config.currentpanel==0? 0 : config.beltoffset)
    		config.$belt.css({left: -endpoint+'px'})
    		if (config.defaultbuttons.enable==true){ //if enable default back/forth nav buttons
    			var $navbuttons=this.addnavbuttons($, config, config.currentpanel)
    			$(window).bind("load resize", function(){ //refresh position of nav buttons when page loads/resizes, in case offsets weren't available document.oncontentload
    				config.offsets={left:stepcarousel.getoffset(config.$gallery.get(0), "offsetLeft"), top:stepcarousel.getoffset(config.$gallery.get(0), "offsetTop")}
    				config.$leftnavbutton.css({left:config.offsets.left+config.defaultbuttons.leftnav[1]+'px', top:config.offsets.top+config.defaultbuttons.leftnav[2]+'px'})
    				config.$rightnavbutton.css({left:config.offsets.left+config.$gallery.get(0).offsetWidth+config.defaultbuttons.rightnav[1]+'px', top:config.offsets.top+config.defaultbuttons.rightnav[2]+'px'})
    			})
    		}
  2. clairegriffin
    Member
    Posted 3 years ago #

    *bump*

    Sorry to bring this up again, but does anyone know of anything I can do here?

Topic Closed

This topic has been closed to new replies.

About this Topic