Skip to content

Instantly share code, notes, and snippets.

@dennisschipper
Created January 2, 2012 11:13
Show Gist options
  • Select an option

  • Save dennisschipper/1550318 to your computer and use it in GitHub Desktop.

Select an option

Save dennisschipper/1550318 to your computer and use it in GitHub Desktop.

Revisions

  1. dennisschipper revised this gist Jan 2, 2012. 1 changed file with 9 additions and 0 deletions.
    9 changes: 9 additions & 0 deletions output.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    A {
    -moz-transition: all 1s ease-in-out 0.2s;
    -webkit-transition: all 1s ease-in-out 0.2s;
    -ms-transition: all 1s ease-in-out 0.2s;
    -o-transition: all 1s ease-in-out 0.2s;
    transition: all 1s ease-in-out 0.2s; }

    A:hover {
    color: #006699; }
  2. dennisschipper revised this gist Jan 2, 2012. 1 changed file with 11 additions and 0 deletions.
    11 changes: 11 additions & 0 deletions basic.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,11 @@
    A {
    -moz-transition: all 0.5s ease-in-out .2s;
    -webkit-transition: all 0.5s ease-in-out .2s;
    -ms-transition: all 0.5s ease-in-out .2s;
    -o-transition: all 0.5s ease-in-out .2s;
    transition: all 0.5s ease-in-out .2s;
    }

    A:hover {
    color: #006699;
    }
  3. dennisschipper revised this gist Jan 2, 2012. 2 changed files with 19 additions and 1 deletion.
    1 change: 0 additions & 1 deletion transitions.scss
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,3 @@

    @mixin default_transition($time, $effect, $delay) {
    -moz-transition: all $time $effect $delay;
    -webkit-transition: all $time $effect $delay;
    19 changes: 19 additions & 0 deletions transitions_default.scss
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    @mixin default_transition($time : 0.2s, $effect : ease-in-out, $delay : 0.2s) {
    -moz-transition: all $time $effect $delay;
    -webkit-transition: all $time $effect $delay;
    -ms-transition: all $time $effect $delay;
    -o-transition: all $time $effect $delay;
    transition: all $time $effect $delay;
    }

    A { /* pass values to the mixin */
    @include default_transition(1s, ease-in-out, 0.2s)
    }

    A { /* or leave this empty it will use the default values */
    @include default_transition
    }

    A:hover {
    color: #006699;
    }
  4. dennisschipper created this gist Jan 2, 2012.
    16 changes: 16 additions & 0 deletions transitions.scss
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@

    @mixin default_transition($time, $effect, $delay) {
    -moz-transition: all $time $effect $delay;
    -webkit-transition: all $time $effect $delay;
    -ms-transition: all $time $effect $delay;
    -o-transition: all $time $effect $delay;
    transition: all $time $effect $delay;
    }

    A {
    @include default_transition(0.5s, ease-in-out, 0.2s)
    }

    A:hover {
    color: #006699;
    }