Slider help

This topic is: not resolved

Tagged: ,

This topic contains 3 replies, has 2 voices, and was last updated by  Anita 1 year, 8 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

    Anita
    Participant
    Post count: 7565

    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.


    When asking for help, please provide a link or screen shot showing your problem!
    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me!

    #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

    Anita
    Participant
    Post count: 7565

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


    When asking for help, please provide a link or screen shot showing your problem!
    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me!

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

You must be logged in to reply to this topic.