This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Image Hover

Open 3 replies generalquestion
vijaya kumar Veeraragalu
9 years ago · Last reply by Alex S 9 years ago

I tried to implement hover effect on so-widget-image, as per the below

.so-widget-image:hover {
display: block;
position: absolute;
z-index: 20;
background: rgba(0, 0, 0, 0.8);
overflow: hidden;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

but it is not working. can you help us to resolve

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Alex S Staff 9 years, 11 months ago

    Hi Vijaya,

    I’ve corrected your CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

    .so-widget-image {
    position: relative;
    background: rgba(0, 0, 0, 0.8);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    top: 0;
}
.so-widget-image:hover {
    top: 5px;
}

    You might also need to install the SiteOrigin CSS Editor.

  2. vijaya kumar Veeraragalu 9 years, 11 months ago

    hi

    I tried to implement hover effect on sow-container-square, in square container am using background image as icon

    .sow-icon-container sow-container-square : hover {
    background: rgb(68,68,68);
    }

    but it is not working. can you help us to resolve

  3. Alex S Staff 9 years, 11 months ago

    Hi Vijaya,

    Your selectors are the issue. Without the class attached to sow-container-square text the browser will treat it as an element. Please try the following updated CSS.

    If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor.

    .sow-icon-container .sow-container-square:hover {
    background: rgb(68,68,68);
}

    You might also need to install the SiteOrigin CSS Editor.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread