Skip to content

Instantly share code, notes, and snippets.

@cacheflowe
Last active December 29, 2015 12:08
Show Gist options
  • Select an option

  • Save cacheflowe/7668084 to your computer and use it in GitHub Desktop.

Select an option

Save cacheflowe/7668084 to your computer and use it in GitHub Desktop.

Revisions

  1. cacheflowe revised this gist Dec 16, 2013. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.txt
    Original file line number Diff line number Diff line change
    @@ -21,7 +21,7 @@



    /* or even fancier with zoom */
    /* or even fancier with zoom (though this had problems on mobile - the layer captured swipes for scrolling) */


    .hide-none
  2. cacheflowe revised this gist Dec 16, 2013. 1 changed file with 40 additions and 0 deletions.
    40 changes: 40 additions & 0 deletions gistfile1.txt
    Original file line number Diff line number Diff line change
    @@ -12,3 +12,43 @@
    -webkit-transition: visibility 0s linear, opacity 0.4s linear
    opacity: 1
    visibility: visible









    /* or even fancier with zoom */


    .hide-none
    display: none

    .hide
    opacity: 0
    visibility: hidden

    -webkit-transform: scale(0.9)
    -moz-transform: scale(0.9)
    transform: scale(0.9)

    // to be added to .hide after init
    .hide-ready
    -webkit-transition: visibility 0s linear 0.4s, opacity 0.4s linear, -webkit-transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)
    -moz-transition: visibility 0s linear 0.4s, opacity 0.4s linear, -moz-transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)
    transition: visibility 0s linear 0.4s, opacity 0.4s linear, transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)

    .hide-ready.showing
    -webkit-transition: visibility 0s linear, opacity 0.4s linear, -webkit-transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)
    -moz-transition: visibility 0s linear, opacity 0.4s linear, -moz-transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)
    transition: visibility 0s linear, opacity 0.4s linear, transform 0.4s cubic-bezier(0.770, 0.000, 0.175, 1.000)

    opacity: 1
    visibility: visible

    -webkit-transform: scale(1.0)
    -moz-transform: scale(1.0)
    transform: scale(1.0)
  3. cacheflowe created this gist Nov 26, 2013.
    14 changes: 14 additions & 0 deletions gistfile1.txt
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,14 @@
    .hide
    opacity: 0
    visibility: hidden

    // to be added to .hide after init
    .hide-ready
    transition: visibility 0s linear 0.4s, opacity 0.4s linear
    -webkit-transition: visibility 0s linear 0.4s, opacity 0.4s linear

    .hide-ready.showing
    transition: visibility 0s linear, opacity 0.4s linear
    -webkit-transition: visibility 0s linear, opacity 0.4s linear
    opacity: 1
    visibility: visible