Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › How can I make content disappear into transparency when scrolling ?

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • May 13, 2013 at 8:59 am #44741
    PE1234
    Member

    I have read more than 30 similar discussions in www and have not yet found an answer to my specific problem

    I am trying to have a scrollable content disappear some pixels BENEATH my header into TRANSPARENCY, because my whole content floats over full screen images.

    http://herlopz.com/clientes/patrick/proyecto1/ — website is Project status, nothing official yet.

    I could do it with the scrollbar inside the content container BUT i do not want that, I want the scroll bar outside ..

    On this site:

    http://herlopz.com/clientes/patrick/proyecto1/referenzen/

    you can see that I use a fixed side navigation container and i want the content to disappear at the same height when scrolling and not under the header …

    I really hope somebody can help me.

    Thanks so much in advance for taking your time.

    May 13, 2013 at 9:42 am #134912
    unasAquila
    Participant

    [Something like](http://codepen.io/anon/pen/hEpea) ?

    May 13, 2013 at 9:57 am #134915
    PE1234
    Member

    Hello,

    thanks for teh effort, but the issue is if you have open my project link that I have a full screen background where the content is floating on top, so I can not use a gradient ..

    :-/

    May 13, 2013 at 9:59 am #134916
    Paulie_D
    Member

    That being the case, simple answer, you probably can’t without extensive use of javascript.

    Would that be a solution for you?

    May 13, 2013 at 10:01 am #134917
    Paulie_D
    Member

    Thinking again, perhaps an positioned ‘overlay’ div just under the header with an opacity gradient?

    May 13, 2013 at 10:58 am #134922
    PE1234
    Member

    Well, do you have any code proposition to make a test ? I have tried so much :-(

    PE

    May 13, 2013 at 11:04 am #134923
    Paulie_D
    Member

    >Well, do you have any code proposition to make a test?

    Nope, if you put something ( a reduced case perhaps) in Codepen we could play with it; we can’t do all the work for you.

    May 13, 2013 at 11:43 am #134930
    CrocoDillon
    Participant

    > Thinking again, perhaps an positioned ‘overlay’ div just under the header with an opacity gradient?

    I think that would just show the content underneath it. I’m thinking maybe extend the header height but show the proper part of the background on the extended part, with background positioning. Hacky…

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘CSS’ is closed to new topics and replies.