Forums

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

Home Forums CSS Fullpage image slider using responsive grid

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #40249
    ashapanka
    Participant

    Hi all! I am using 996grid.com to build my site, which is a responsive grid. I am trying to include a fullscreen image slider on the homepage, but am having a hard time. I realize I have to put the slider outside of the container to achieve 100% width. My problem is that having the slider position:relative, this is pushing my container out of place. Does anyone have any advice, or examples, as to if this can be done?

    #111658
    Paulie_D
    Member

    Do you have a link to a live site?

    I’m not sure why you are positioning the slider at all.

    http://codepen.io/anon/pen/neidF

    #111663
    ashapanka
    Participant

    Thanks, unfortunately this site isn’t live. That’s an interesting solution you have, but my goal is to only have 1 container, and have that be on top of the image slider (ie: container –> z-index: 1; slider: z-index:2). That way the content in the container will be visible and the slider is sliding images in the background.

    #111665
    Paulie_D
    Member

    It’s either inside the container or it isn’t.

    If it is then you’re stuck with 996px.

    #111670
    ashapanka
    Participant

    I understand that. The slider is outside of the container. The problem is that both the slider and the container have “position: relative;.” In order for the full background to work, one has to be absolute.

    #111676
    Paulie_D
    Member

    Why do they have position relative?

    #111680
    ashapanka
    Participant

    I’m not sure…. should i get rid of that? Then have the container be relative and the images in the slider be absolute?

    #111708
    ashapanka
    Participant

    I found a solution: http://srobbin.com/jquery-plugins/backstretch/

    amazing little plugin, thanks for the help!

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