Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question make active thumbnail highlighted in bootstrap carousel

    I have got this link https://bootsnipp.com/index.php/snip...ousel-extended which is actually what I am trying to achieve. But how can I make the active thumbnail highlighted or how can I give some class to it? Please help!!

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,950
    Thanks
    9
    Thanked 724 Times in 718 Posts
    I haven't tested this but:

    Code:
    // When the carousel slides, auto update the text
    $('#myCarousel').on('slid', function (e) {
    var id = $('.item.active').data('slide-number');
    $('#carousel-text').html($('#slide-content-'+id).html());
    $('.activeThumbnail').removeClass('activeThumbnail');//remove the class from any already active thumbnails
    $('#carousel-selector-'+id).addClass('activeThumbnail');//..and add it to the newly active one
    });
    plus, following the approach used elsewhere, add the class 'activeThumbnail' to #carousel-selector-0.
    Use the W3C HTML Validator and CSS Validator to check your code and Firebug to see what css is applied to an element
    Read Steve Krug's book Don't Make Me Think - essential reading on web usability
    I don't recommend much, but I do recommend Clook for UK web hosting


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •