Slider help

This topic is: not resolved

Tagged: ,

This topic contains 3 replies, has 2 voices, and was last updated by  AC 1 year, 10 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #8456

    briegger
    Participant
    Post count: 23

    Hey folks!

    I could use some guidance, I’ve got 2 different questions RE Sliders/Slideshows.

    I’m looking for a way to be able to center the slide show on the page:  http://k2smarketing.com/cmacco/offices/
     I’d like to add a background and have the slideshow play within it, like a picture frame or a picture of a tv/ipad or something. I just want to give it a bit more depth.

    Thanks everybody!

    #8547

    AC
    Blocked
    Post count: 7712

    Well, if it were me, I would change the template to FULL WIDTH. Remove that Contact Us button because you can clearly see the Contact Us on the Navigation. Then you can make the slider the full with.

    For the background, you could possibly wrap the slider code with a background image, but I am not quite sure how to do that – so I will defer that to someone.

    #8605

    briegger
    Participant
    Post count: 23

    Thanks Anitac! It seems the slideshow is left justified so if I change templates, it always puts it on the left.

    Here’s the code:

    .slideshow_container { }

    .slideshow_container .slideshow { }

    .slideshow_container img { }

    .slideshow_container .slide {
    margin-right: 2px;
    }

    .slideshow_container .transparent {
    filter: alpha(opacity = 50);
    opacity: 0.5;
    }

    .slideshow_container .transparent:hover {
    filter: alpha(opacity = 80);
    opacity: 0.8;
    }

    .slideshow_container .description {
    background: #000;
    }

    .slideshow_container .controlPanel {
    width: 21px;
    height: 21px;
    background: #000;
    border-radius: 2px;
    -moz-border-radius: 10px;
    }

    .slideshow_container .controlPanel ul { }

    .slideshow_container .controlPanel ul li {
    margin: 3px;
    width: 15px;
    height: 15px;
    }

    .slideshow_container .controlPanel ul li:hover { }

    .slideshow_container .play {
    background: url(‘%plugin-url%/images/SlideshowPlugin/light-controlpanel.png’) 0 0 no-repeat;
    }

    .slideshow_container .pause {
    background: url(‘%plugin-url%/images/SlideshowPlugin/light-controlpanel.png’) -15px 0 no-repeat;
    }

    .slideshow_container .button {
    margin-top: -20px;
    height: 40px;
    width: 19px;
    background: url(‘%plugin-url%/images/SlideshowPlugin/light-arrows.png’) no-repeat;
    }

    .slideshow_container .previous { }

    .slideshow_container .next {
    background-position: -19px 0;
    }

    .slideshow_container a {
    text-decoration: none;
    color: #fff;
    text-align: center;
    }

    .slideshow_container .description h2,
    .slideshow_container .description p {
    color: #fff;
    }

    .slideshow_container h2 {
    margin: 5px;
    font-size: 25px;
    }

    .slideshow_container p {
    margin: 7px;
    font-size: 15px;
    }

    #8610

    AC
    Blocked
    Post count: 7712

    Did you add the slider as a widget to the page or did you use a shortcode?

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.