Wordpress auto width carousel
Out of context: Reply #4
- Started
- Last post
- 4 Responses
- monNom1
quick solution: javascript
all images go in an absolutely positions container like
[ img ][img[ img ][img[ - img - ][img[ img ][img][ - img - ][img]
when the page loads, use javascript to grab the width of each image. stick those results in an array.
now, when you click the image button, you set the positioning of your container to half the screen width, minus (half the index image width plus all the widths of the previous images combined).
psuedo-code:
containter_el = getElementReference();
screen_w = getScreenWidth();
img_w = getImageWidthsArray();function gotoImageNum(index){
offset = (screen_w/2) - ((img_w[index]/2) + getSumOfArray(index));
container_el.style.left = offset;
}function getSumOfArray(index){
var out = 0, i = 0;
while(i<index){
out += img_w[i];
i++
}
return out;}
easy!
- monNom you are an "Array" of sunshine.utopian
- thanks for this - yes I have access to Slick / Owl jQuery plugins which do exactly what I need - but I was looking for a Wordpress plugin that does it...fadein11
- No budget to integrate a jQuery plugin into Wordpress - or may be - but I would rather not do it if there is an off the shelf solution.fadein11