This question is answered.


Permlink Replies: 2 - Pages: 1 - Last Post: 25 Feb 21, 09:07 Last Post By: al-j Threads: [ Previous | Next ]
al-j

Posts: 72
Registered: 28-May-2012
Highlight active thumbnail strip in Lightbox
Posted: 24 Feb 21, 23:37
 
  Click to reply to this thread Reply
I have changed the Thumbnail strip in Projector to display in full color. How do I highlight the active strip image with a box or line above or below?

Sample album https://al-j.net/

Thanks
Al-J

Edited by: al-j on 24-Feb-2021 14:38
Laza

Posts: 1,798
Registered: 6-Sep-2005
Re: Highlight active thumbnail strip in Lightbox
Posted: 25 Feb 21, 08:49   in response to: al-j in response to: al-j
Correct
  Click to reply to this thread Reply
I see, you have added a CSS rule to make all the thumbnails look the same, then all thumbnails started to look the same:
#main > .cont .thumbnails .clip .thumb-cont .thumb img {
    opacity: 1.0 !important;
    filter: none !important;
}

1. No need using "!important" here. That'd make the further modifications impossible, for e.g. the active element.
2. To highlight the active thumbnail you'll have to add a rule using the ".active" hook:
#main > .cont .thumbnails .clip .thumb-cont .thumb img {
    opacity: 1.0;
    filter: none;
}
#main > .cont .thumbnails .clip .thumb-cont .thumb.active img {
    border-bottom: 5px solid red;
}

This will add a red bottom bar to the active element.
al-j

Posts: 72
Registered: 28-May-2012
Re: Highlight active thumbnail strip in Lightbox
Posted: 25 Feb 21, 09:07   in response to: Laza in response to: Laza
 
  Click to reply to this thread Reply
Works perfectly - Thankyou so much

AL-j
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums