Instagram link...

Paris

Hey,
I have created a standalone button under my menu that links to my Instagram page.
Ii works when I click on it, however, I can't figure out how to code it so it fades on hover.
Help please.

Hikin' Mike

This will add a .5sec transition on all links. So when you hover on a nav link it slows the transition from black to red. The second code is the fade for your Instagram Button. I set it for 50% opacity. 0 is invisible and 1 is 100% visible.

    /* Transitions on all links */
.sm-user-ui a {
     -webkit-transition: all 0.5s ease-out;
        -moz-transition: all 0.5s ease-out;
         -ms-transition: all 0.5s ease-out;
          -o-transition: all 0.5s ease-out;
             transition: all 0.5s ease-out; 
    }

    /* Opacity on Hover */
.sm-page-widget-19844562 .sm-tile a:hover {
    opacity: .5;

    }

Hikin' Mike

If you only want this on your Instagram Button, use this instead:

.sm-page-widget-19844562 .sm-tile a {
     -webkit-transition: all 0.5s ease-out;
        -moz-transition: all 0.5s ease-out;
         -ms-transition: all 0.5s ease-out;
          -o-transition: all 0.5s ease-out;
             transition: all 0.5s ease-out; 
    }

    .sm-page-widget-19844562 .sm-tile a:hover {
        opacity: .5;
        }   

Paris

Thx Mike works great!

BTW do you know why the button does not show up below the menu when in Homepage?
I set it to work on the Entire Site.

Smug Eric

The CSS you have added for the banner image that shows when you first load your homepage is also affecting the instagram image. You'll want to use .sm-page-widget-19789589 instead of .sm-page-widget-image to specify just the one content block and not all image content blocks added on your page.

Paris

Brilliant Smug Eric. Gracia!

While I have you here... Do you know why my SlideShow starts with the second image.
Mike and I both think it is because the banner page cancels the first image in the cue.
Thoughts?

Smug Eric

It looks like your slideshow is loading and starting in the background behind that banner image. With the time the banner image is shown it has enough time to cycle past the first image onto the second one. It might be worth adding a splash image or slowing the speed down for your slideshow.

Paris

Thanx Eric.
For now I just moved the last image to the front and that does the trick.