Infinite Carousel problem and workaround

Gary Cunningham-Lee Monday 21 of September, 2009

In my experience, the Infinite Carousel on the homepage, which displays theme images and download links, wasn't working correctly on the initial page load. The images were displaying side by side, making a really wide page. I checked this in several browsers and all showed the same problem.

The carousel works fine in a normal HTML page, so apparently the problem is due to something not loading initially. To see this, clear your browser caches and visit Tiki 3 Themes, the wiki page that holds the carousel now. For me anyway, in all my browsers, the images all display at once, left to right, and there's no motion, no apparent javascript happening for them. Notice also that the module-flip icons aren't there and and working (but do after a page refresh), which I think is another symptom of the same problem. (Of course if the carousel and module-flipping are working for other people on first page load in a cleared-cache browser, then I need to figure out what the difference is with my experience - and all my browsers have default javascript settings.)

As a workaround, I moved the carousel wiki lines from the homepage to Tiki 3 Themes, and edited header.tpl to load the necessary ))JavaScript(( and CSS on both pages. Then I made an iframe on the homepage with the carousel page as the source, using index_p so only the wiki content displays. (I tried using the INCLUDE plugin, which would have been a neater solution, but then the carousel page's head section doesn't load, which defeats the purpose of the second page.

Now I'm getting the effect I wanted - the carousel loads and works correctly on initial homepage display, but at the cost of a really kludgy workaround. I need to check with our experts about solving the problem of ))JavaScript(( not loading or anyway not being effective initially.


Permalink: https://themes.tiki.org/blogpost55-Infinite-Carousel-problem-and-workaround