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!
Avisio Slider Caption Block
16 posts from 4 voices-
Posted 1 year ago #
-
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 backgroundYou can set the value to something between 0 and 1.
Posted 1 year ago # -
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?
Posted 1 year ago # -
I think the problem is the empty slidercontent div - try to add following code to style.css:
.slidercontent {
display: none;
}Posted 1 year ago # -
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;
}Posted 1 year ago # -
Ok - a rule on line 447 overwrites your code. Try:
.slidercontent {
display: none !important;
}Posted 1 year ago # -
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!
Posted 1 year ago # -
Hi Dude...any more ideas about how to fix this issue? Thanks!
Posted 1 year ago # -
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; }Posted 1 year ago # -
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.
Posted 1 year ago # -
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; }Posted 1 year ago # -
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
Posted 1 year ago # -
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; }Posted 1 year ago # -
Hey guys, anyone know how to change the slider description to left aligh instead of center now....?
http://auramas.com.my/wp/Posted 1 month ago # -
Hi!
Add following code to style.css:
#top a .feature_excerpt { text-align: left !important; }Regards,
PeterPosted 1 month ago # -
Thanks Peter, it works.
Posted 1 month ago #
Topic Closed
This topic has been closed to new replies.














