Skip to Content
Menu

keyframes()

A cross-browser shortcut for keyframe animation.

Sass February 22, 2017
  1. Nebula
  2. /
  3. Functions
  4. /
  5. keyframes()

Usage

Sass 
keyframes($animation-name)

Parameters

$animation-name
(Required) (String) The name of the corresponding animation
Default: None

Request or provide clarification »

Examples

Sass 
@include keyframes(slide-down){
    0% {opacity: 1;}
    90% {opacity: 0;}
}
Was this page helpful? Yes No


    A feedback message is required to submit this form.


    Please check that you have entered a valid email address.

    Enter your email address if you would like a response.

    Thank you for your feedback!

    Source File

    Located in /assets/scss/partials/_mixins.scss on line 266.

    Sass 
    @mixin keyframes($animation-name){
    @-webkit-keyframes $animation-name {@content;}
    @keyframes $animation-name {@content;}
}

    Override

    To override or disable this, redefine the mixin/function later on, or use different class names to prevent this from targeting your element.

    Sass 
    @mixin keyframes($animation-name){
    //Write your own code here, leave it blank, or return false.
}

    « Back to functions & variables list