Forums

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

Home Forums CSS CSS3 transform and z-indexes

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #40413
    ideaprison
    Participant

    Help me tame this bug in Safari please, in Chrome (uses Webkit like Safari) the page works fine.
    The front of the box needs to stay on top of the albums but when you click an album then play makes it fly out, that should be on top of the front.

    Still haven’t figured out a solution, is what i want to do impossible? (Currently getting it to work in just webkit browsers)

    Here’s how it operates, you can flip (or click top/bottom) to go through the albums.
    Click an album, then click it’s center to make it fly out, This albums should be **on top** of the .box-front

    New version
    http://jsfiddle.net/ideaprison/Tptxf/

    Using the transform on the .box-front makes the .new albums when flipping pass through it.
    http://jsfiddle.net/ideaprison/Tptxf/1/

    Just with position:;
    http://jsfiddle.net/ideaprison/NgmEJ/

    Hope I made myself clear, else have a look using [Chrome] at saltyknuckles.net/archives/ to see how it should function.

    Thanks all!

    #112402
    ideaprison
    Participant

    Thats okay, i will add that the more i kept trying to get it to work the messier it probably got.
    if you check out http://www.saltyknuckles.net/archives/ in Chrome then you can see how it should work

    #112418
    ideaprison
    Participant

    #112458
    ideaprison
    Participant

    #112428
    ideaprison
    Participant

    Still haven’t figured out a solution, is what i want to do impossible? (Currently getting it to work in just webkit browsers)

    Here’s how it operates, you can flip (or click top/bottom) to go through the albums.
    Click an album, then click it’s center to make it fly out, This albums should be **on top** of the .box-front

    New version
    http://jsfiddle.net/ideaprison/Tptxf/

    Using the transform on the .box-front makes the .new albums when flipping pass through it.
    http://jsfiddle.net/ideaprison/Tptxf/1/

    Just with position:;
    http://jsfiddle.net/ideaprison/NgmEJ/

    #197422
    captain lardnicus
    Participant

    swap all references to preserve-3d with flat… i.e.

    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;

    to

    transform-style: flat;
    -webkit-transform-style: flat;
    -moz-transform-style: flat;

    Although not ideal, and might cause other problems, that seems to be the simplest way to respect z-order.

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