Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Carousel Change first shown item

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #148611
    chumii
    Participant

    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

    #148617
    Kuzyo
    Participant

    you have to remove from your html:

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

    and change in js code:

    circular: true,
    
    #148618
    chumii
    Participant

    Wow, easy as this :)

    working like a charm, thank you very much

    #148623
    chumii
    Participant

    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…

    #148629
    Kuzyo
    Participant

    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 :)

    #148630
    chumii
    Participant

    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

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.