Okay
  Public Ticket #1260878
LIGHTBOX SIDE ARROW
Closed

Comments

  •  17
    Marcelo started the conversation
    August 1, 2017 at 7:16pm

    Is there another way this lightbox side arrow appears? This rectangle is over the photo. This is not good. Generates interference under the picture. A photo site has to leave 100% free photo. Can you hide this rectangle?

    VIEW

    http://imgur.com/83gCTQE

    LINK

    http://valencaevalenca.profissional.ws/valencachild/casa-02-ba/


    I used this code

    .nivo-lightbox-theme-default .nivo-lightbox-nav:hover {
        opacity: 1;
        background-color: none!important;
    }


  • [deleted] replied
    August 2, 2017 at 12:48am

    Hi Marcelo

    Can you try this code below:

    .nivo-lightbox-theme-default .nivo-lightbox-nav:hover {
    opacity: 1;
    background-color: rgba(0,0,0,0) !important;
}
  •  17
    Marcelo replied
    August 2, 2017 at 11:22am

    Perfect Eroll. 


    Tks

  • [deleted] replied
    August 2, 2017 at 2:58pm

    Hi there,

    I'm glad to hear that

    Will set this ticket as solved from here.

  •  17
    Marcelo replied
    August 2, 2017 at 5:20pm

    Eroll, how to change color of the a.nivo-lightbox-close?

  • [deleted] replied
    August 2, 2017 at 7:45pm

    Hi Marcelo

    Please always open new ticket for your question.

    You already have the code in Custom CSS, just change the color.

    .nivo-lightbox-theme-default .nivo-lightbox-next:after, 
.nivo-lightbox-theme-default .nivo-lightbox-prev:after {
    color: #000;
}
  •  17
    Marcelo replied
    August 2, 2017 at 7:51pm

    Eroll, thanks for the feedback. The color I want to change is the arrow to close the lightbox. It is in the upper right corner.

  • [deleted] replied
    August 3, 2017 at 4:27am

    Hi Marcelo

    You have to upload the image to Media Library, and pickup full url of image and putted on url('http://full path to image');

    @media (-webkit-min-device-pixel-ratio: 1.3),       
    (-o-min-device-pixel-ratio: 2.6/2),       
    (min--moz-device-pixel-ratio: 1.3),       
    (min-device-pixel-ratio: 1.3),       
    (min-resolution: 1.3dppx) {    
        .nivo-lightbox-theme-default .nivo-lightbox-close {         
            background-image: url('new_url_of_image');         
            background-size: 16px 16px;    
        }
}
.nivo-lightbox-theme-default .nivo-lightbox-close {     
    background: url('new_url_of_image') no-repeat 5px 5px;
}

    You can learn more about Background Property on this link

  •  17
    Marcelo replied
    August 3, 2017 at 10:39am

    Okay, Eroll. I'll test.

    I only asked for this because the lightbox background turned white and the button disappeared on the screen. OK?

    Thanks a lot for the help.

  •  17
    Marcelo replied
    August 3, 2017 at 10:56am

    Eroll, I tested. I did the way you said it. Did not work.

    / * CLOSE LIGHTBOX * /

    @media (-webkit-min-device-pixel-ratio: 1.3),       
        (-o-min-device-pixel-ratio: 2.6/2),       
        (min--moz-device-pixel-ratio: 1.3),       
        (min-device-pixel-ratio: 1.3),       
        (min-resolution: 1.3dppx) {    
            .nivo-lightbox-theme-default .nivo-lightbox-close {         

                background-size: 16px 16px;    
            }
    }
    .nivo-lightbox-theme-default .nivo-lightbox-close {     

    }

  • [deleted] replied
    August 3, 2017 at 5:25pm

    Hi Marcelo

    I did it, i had just to put !important at the end.

    Ciao