Tagged: , ,

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #6943

    I would like to resize the slider caption block, have the title centered in the block, and make the block background more transparent. To resize the block I modified the style.css file as suggested in this thread: http://www.kriesi.at/support/topic/cleancut-slider-vs-avisio-caption-options#post-10813. There was no change at all after change the height and width. Can you suggest an alternative that would work to change the size, as well as center the title, and make the background more transparent. Thanks!

    #55989

    Hey,

    you can change the width/max-height in style.css – search for following code:

    .feature_excerpt{
    max-height:400px;
    padding:20px 30px 20px;
    bottom:0;
    display:none;
    font-size:13px;
    line-height:1.8em;
    position:absolute;
    width:250px;
    z-index:3;
    }

    To center the text change the padding – i.e. instead of “20px 30px 20px” use “30px” or “20px”. The background opacity can be changed in js/custom.js – open up the file and search for:

    backgroundOpacity:0.8,		// opacity for background

    You can set the value to something between 0 and 1.

    #55990

    Hi Dude, thanks for the quick response. The opacity change worked. The changes in height and padding didn’t. I changed the height to 200 and padding to 20, but there was absolutely no change. At http://www.sustainability.valiantlane.com you can see that the word “Science” in the first slide is not centered and can probably tell that the block itself is not shorter. Any ideas about what’s happening?

    #55991

    I think the problem is the empty slidercontent div – try to add following code to style.css:

    .slidercontent {

    display: none;

    }

    #55992

    Inserted the code at line 302, didn’t work. I also put in some text for the description to see what would happen. You can see the result at http://www.sustainability.valiantlane.com. Here is the code:

    .feature_excerpt{

    max-height:200px;

    padding:20px;

    bottom:0;

    display:none;

    font-size:13px;

    line-height:1.8em;

    position:absolute;

    width:180px;

    z-index:3;

    }

    .slidercontent {

    display: none;

    }

    .feature_excerpt_pos_2{

    left:0;

    }

    .feature_excerpt_pos_3{

    right:0;

    }

    #top div .feature_excerpt .excerpt_button{

    display:block;

    font-size:24px;

    height:auto;

    margin-top:35px;

    padding:18px 18px 16px;

    text-align:center;

    width:210px;

    }

    #55993

    Ok – a rule on line 447 overwrites your code. Try:

    .slidercontent {

    display: none !important;

    }

    #55994

    That solution removes the description text, but the slider title/caption is still not centered and the shaded block size is still the same. Woo hoo…we’re on a code hunt!

    #55995

    Hi Dude…any more ideas about how to fix this issue? Thanks!

    #55996

    You can try to adjust the padding – add following code to style.css and adjust the 4 values (top right bottom left) individually until the text appears centered for you:

    .feature_excerpt {
    padding: 20px 20px 20px 20px;
    }

    #55998

    Dude, thanks. Unfortunately this just doesn’t work. There was absolutely no change in the padding around the slide title. There must be something in the file or another file that is overriding this code.

    #55999

    Hi,

    I’ll be honest I skimmed through this post so I’m not 100% certain what we’re trying to do here but this worked for me to change the block width and placing of the font:

    .feature_excerpt{width:500px;}

    .sliderheading .cufon {
    padding: 20px 20px 20px 10px;
    }

    #56000

    Hi Chris,

    Thanks for your input. What I am trying to do on the slides in the slider is to:

    1. Reduce the height of the transparent box behind the text

    2. Center the slide title vert & horiz within the transparent box.

    I tried your code, and there is still no change in the position of the title. This can be seen in the first slide, for which “Science” is the slide title: http://www.sustainability.valiantlane.com.

    Either I am not placing the code at the correct place in style.css or there is some other code overriding this in the same file or, perhaps, another file.

    Does this explanation clarify what I would like to do?

    Valerie

    #56001

    Hey,

    it seems to work fine for me – I added it at the bottom of the style1.css file.

    I used this code to make it look somewhat as you describe it:

    .feature_excerpt{width:200px; height:60px;}

    .sliderheading .cufon {
    padding: 20px 20px 20px 10px;
    }

    #56002

    Hey guys, anyone know how to change the slider description to left aligh instead of center now….?

    http://auramas.com.my/wp/

    #56003

    Hi!

    Add following code to style.css:

    #top a .feature_excerpt {
    text-align: left !important;
    }

    Regards,

    Peter

    #56004

    Thanks Peter, it works.

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

The topic ‘Avisio Slider Caption Block’ is closed to new replies.