Jump to content
Sign in to follow this  
tamarpostma

quickslider overlay

Recommended Posts

tamarpostma    0
tamarpostma

Hi!

 

I'm using the quickslider on my home page:

 

www.i-english.nl

 

And I would like to put in the same overlay with text that is used on the featured slider. I am using this code but It's not working:

 




.fslider .fcontent {
    float: right;
}
.fslider .fcontent {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.35);
    color: #FFFFFF;
    display: inline;
    min-width: 220px;
    position: relative;
    text-shadow: 0 -1px 0 #000000;
    width: 33%;
}

 

 

Thanks!

 

Tamar

Share this post


Link to post
Share on other sites
catrina    103
catrina

You may need to add #page to beginning of the CSS selector in order for the CSS to work. For example:

#page .fslider .fcontent

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

Thank you Catrina for the tip. Unfortunately it did not work! Any other suggestions perhaps?

Share this post


Link to post
Share on other sites
catrina    103
catrina

Okay, the issue is that the fcontent selector you're using is only for feature slider, not for Quickslider, so the CSS isn't going to work. In order for you to have a text overlay, you need to use feature slider instead of Quickslider.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

I thought that might be the case! Unfortunately I need to use the quick slider since it can also be used in the wrap. So I will have to find a way around this.

 

Thanks again..

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi Tamar, When you add text to your Slider in the Quick Slider setting, the text will automatically have a similar overlay for your text no custom code required. http://d.pr/i/ECzX You also have multiple options for text position: http://d.pr/i/6wTD


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

Hi Danny,

 

Thanks for your reply. The problem is I need the overlay to be transparent and the text to be black, so it fits in the box. I've been editing .flexcaption, but somehow it won't override the defaults. Is it possible this is not allowed somehow?

 

This is the code so far, I have managed to get the block partly in the black frame but the right and bottom edges are still outside and no matter what I do (margin, padding, em or px) nothing budges and in firebug the element goes back to the default settings.

 

.flex-caption {
   background:transparent;  
    zoom: 1;
       text-align: left;
        max-width: 42%;
        padding: 13px 5%;
        margin: 5px;
        position: absolute;
        right: 5;
        bottom: 5;
        background: rgba(1,1,1,.4);
        color: #fff;
        text-shadow: 0 -1px 0 rgba(0,0,0,.6);
        box-shadow: transparent;
        font-size: 15px;
        line-height: 1.5em;
}


p:before {
       content: "";
    display: block;
    height: 206px;
    overflow: hidden;
    width: 206px;
margin-right:5px;
}

 

Hope you can help!

 

Tamar

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

Ok, so something odd is going on. I changed the slider overlay to transparent, saved the file and then all by itself the site reloaded and it was back to grey overlay. What's going on!

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

I recommend you read our custom CSS documentation, which has information on how to override the default CSS.

 

http://support.pagelines.me/docs/customization/custom-css/

 

Regarding your overlay transparent code is incorrect, its not valid, I recommend you read the W3Schools for the correct code with RGBA.

 

http://www.w3schools.com/cssref/css_colors_legal.asp


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

Hi Danny, Is it possible all this custom css is slowing down the site?

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

Ok, I see. I got the code from the pagelines paste bin and just changed a few settings. I will look at the links you gave.

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

One last thing. Sorry to be such a nuisance!

I have it almost the way I want it. But you say my code is a littel illegal. Is this going to be a problem, or is it so that if it works then it's ok?

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

I'm having really bad loading issues on the site. It's terribly slow and editing take 2 minutes to save and reload. Is this because of my code? Or is it a completely different problem. Also my code for the boxes on the other pages has gone haywire!

 

Please help!

 

Tamar

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

If your issue has been resolved, then use the resolved button, please do not ask multiple questions per post, as your topic title is related to customising the QuickSlider and not your page load time.

 

Therefore, can you create a new topic regarding your page load time issue please.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

ok! Sorry, I thought the loading of the page had to do with all the css code for the quickslider....

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

I apologise the QuickSlider shouldn't effect your page load time, this is either caused by either having a lot of plugins installed or the most likely cause is cheap web hosting.  However, create a new topic regarding this issue and we can investigate further.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tamarpostma    0
tamarpostma

No problem. Cheap hosting highly likely.Thanks again!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×