Results 1 to 5 of 5

Thread: Caption styles for Lightbox image viewer 2.03a

  1. #1
    Join Date
    Sep 2005
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Caption styles for Lightbox image viewer 2.03a

    1) Script Title: Lightbox image viewer 2.03a

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...box2/index.htm

    3) Describe problem:
    I would like to change the font/color of the caption text. What file is that in? I searched lightbox.css, but couldn't find it.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    It's not in there. But you can put it in there. The id of the caption is 'caption' and the id of the Image x of x (used when there is a Lightbox group) is 'numberDisplay'. They're both spans if that's important to you. So for instance you could have:

    Code:
    #caption, #numberDisplay {
    	font-family: 'comic sans ms';
    	color: red;
    }
    If you're using the link option for the caption, it's selector would be #caption a, so you could do like:

    Code:
    #caption a {
    	text-decoration: none;
    }
    Note: This is for Lightbox v2.03a and might not be applicable to other versions. You can always use a DOM inspector to find the selectors for other versions.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Sep 2005
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Thanks. I'm still curious to know if the font style is set in a file or if the script demo is just defaulting to a font. I tried the #caption... css code you gave and the text is always reading bold even though I've set the weight to normal. The font style is working fine, but the weight is not, wondering if code somewhere is overriding it.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Could be. You can aways use the !important keyword. That will override anything scripted, ex:

    Code:
    #caption, #numberDisplay {
    	font-family: 'comic sans ms';
    	font-weight: normal !important;
    	color: red;
    }
    If you want more help:

    Please post a link to a page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Sep 2005
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Thanks! That did the trick!

Bookmarks

Posting Permissions

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