Carousel Change first shown item

[chumii]

Hi guys,

i am using this carousel
http://coolcarousels.frebsite.nl/c/35/
on my site. everything works fine.

What I would like to change, is the first item shown when you first load the website.
As you can see on the site, the first item is centered, and the carousel starts to the right. I would like the 2nd item to be the first shown, so when i load the page it should look like this

ITEM 1 grey | CENTERED ITEM 2 | ITEM 3 grey

I dont want to overload this post, you can check the code on the example page (just scroll down a bit and click the […] button). I didnt change anything in the code except colors.
Hope you get what i mean :D

greets
chumii

[Kuzyo]

you have to remove from your html:

<div class="empty"></div>

and change in js code:

circular: true,

[chumii]

Wow, easy as this :)

working like a charm, thank you very much

[chumii]

Sry for multipost, cant edit my previous one, but i got another tiny bit i would like to change with that carousel, maybe you can help me too:

i want the images to be a link to another page (using it as a news-overview kind of thing), but if i do

<div style="background-color: #cec;">
<a href="example.html"><img src="img/bugs.jpg" width="554" height="313" /></a>
<img src="img/bugs-grey.jpg" width="554" height="313" />
<span>A Bug's Life</span>
</div>

nothing happens. it still has the tags in sourcecode, but the image itself is not clickable…

[Kuzyo]

try this way:

 <a href="http:/facebook.com">
                <div style="background-color: #cec;">
                    <img src="img/bugs.jpg" width="554" height="313" />
                    <img src="img/bugs-grey.jpg" width="554" height="313" />
                    <span>A Bug's Life</span>
                </div>
    </a>

But I don’t know about validation :)

[chumii]

Hm, didn’t work that way, messed up css , but you got me into the right direction.

it’s

            <div style="background-color: #cec;">
                 <a href="http:/facebook.com">
                <img src="img/bugs.jpg" width="554" height="313" />
                <img src="img/bugs-grey.jpg" width="554" height="313" />    </a>
                <span>A Bug's Life</span>
            </div>

Well, the grey preview will be a link too, but i can live with that. Thanks again for your help, getting closer and closer to what i want :D

[Author]

Posts