After further investigation, and after Firefox broke again, I've fixed
it and it appears to be consistently working in all the browsers we
test on here (that's IE6, IE7, Firefox and Safari).
I needed to surround the function that sets up the carousel with
window.setTimeout.
window.setTimeout( function() {
$('#carousel').Carousel({
itemWidth: 120,
itemHeight: 80,
itemMinWidth: 40,
items: 'a',
reflections: .4,
rotationSpeed: 1
});
$("#carousel").animate({
display: "block",
top: 0
}, 1000);
}, 500);
And now it works properly, that 500ms timeout seems to have done the
trick (although I'm sure I'll need to modify that when I put it on our
slower live server).
In any case, thanks for your pointers in the right direction - and if
you look for the other thread I started on here, you'll see a link to
a ticket for how I've managed to get the Carousel working in Safari (I
notice your own code detects Safari and doesn't start the carousel if
so).
Thanks!
On May 4, 10:20 am, MrTufty <[EMAIL PROTECTED]> wrote:
> I really wish I understood why, but I don't. It is however, now
> working. :|
>
> On May 4, 9:46 am, MrTufty <[EMAIL PROTECTED]> wrote:
>
> > Ok, I didn't have var noRotate = false; before, as it wasn't mentioned
> > anywhere that it was necessary.
>
> > Here's the code that I have for my Carousel - I haven't included the
> > main page this comes from, this is just the part that gets loaded with
> > Ajax, into a div called #main-area. I've changed the call for it to
> > match what you've done for your site, but it still doesn't work. I get
> > an error in jquery.js - line 1939 (missing ; before statement). Any
> > ideas?
>
> > <div id="carousel">
> > <a href="#"><img src="img/alcoholic.png" width="100%" /></a>
> > <a href="#"><img src="img/clouds.png" width="100%" /></a>
> > <a href="#"><img src="img/coffee.png" width="100%" /></a>
> > <a href="#"><img src="img/concentrates.png" width="100%" /></a>
> > <a href="#"><img src="img/emulsions.png" width="100%" /></a>
> > <a href="#"><img src="img/energy.png" width="100%" /></a>
> > </div>
>
> > <script type="text/javascript">
>
> > jQuery(function() { window.onload = function() {
>
> > if( noRotate == true ) return false;
>
> > $('#carousel').Carousel({
> > itemWidth: 120,
> > itemHeight: 80,
> > itemMinWidth: 40,
> > items: 'a',
> > reflections: .2,
> > rotationSpeed: 6
> > });
>
> > });
>
> > </script>
>
> > On May 3, 6:05 pm, [EMAIL PROTECTED] wrote:
>
> > > > Is it possible to make the carousel work when it's being loaded into a
> > > > div via Ajax?
>
> > > Can you post some code/link?
>
> > > Have you set: var noRotate = false;
>
> > > I have it working here:http://www.activespotlight.com/
>
> > > *
