Question

I can’t get my CLOSE WINDOW text to show up. Could it be white somehere?!

According to the Developer “CLose” should be the correct value to change.

transition: "elastic",
    speed: 300,
    width: false,
    initialWidth: "600",
    innerWidth: false,
    maxWidth: false,
    height: false,
    initialHeight: "450",
    innerHeight: false,
    maxHeight: false,
    scalePhotos: true,
    scrolling: true,
    inline: false,
    html: false,
    iframe: false,
    photo: false,
    href: false,
    title: false,
    rel: false,
    opacity: 0.9,
    preloading: true,
    current: "image {current} of {total}",
    previous: "previous",
    next: "next",
    close: "Click to Close Window",
    open: false,
    returnFocus: true,
    loop: true,
    slideshow: false,
    slideshowAuto: true,
    slideshowSpeed: 2500,
    slideshowStart: "start slideshow",
    slideshowStop: "stop slideshow",
    onOpen: false,
    onLoad: false,
    onComplete: false,
    onCleanup: false,
    onClosed: false,
    overlayClose: true,     
    escKey: true,
    arrowKey: true

This is the live example: (CLICK the RED Buttons)
http://whiterhino.us/aspire_setup/

ColorBox Developers Site:
http://colorpowered.com/colorbox/

Answer 1

The text-indent on the modal close button is set to -9999px; So what’s happening is the text is being shifted wayyy off the element so that only the image is visible. I assume this is intended.

The reasoning behind this would be almost everyone in the world will see the image of the “x” and know they should click it to close the box, but for the few who use screen readers or are vision impaired, the screen reader will still read “Click to close window”.

If you really want to see the text (it’s going to look dirty), remove the CSS rule that looks like:

#cboxClose {
    text-indent: -9999px;
}