impress.js under the hood

We learned how effects in impress work and various kinds of techniques and scenarios. I am sure you would like to explore the core of the impress.js library and learn how these effects really work inside the library, so in this section we'll look at the core code to find the effects.

Once the presentation is loaded on the browser, impress.js will call its initStep function to initialize all the steps. The following is the code for the iniStep function:

var initStep = function ( el, idx ) {
    var data = el.dataset,
        step = {
            translate: {
                x: toNumber(data.x),
                y: toNumber(data.y),
                z: toNumber(data.z)
            },
            rotate: {
                x: toNumber(data.rotateX),
                y: toNumber(data.rotateY),
                z: toNumber(data.rotateZ || data.rotate)
            },
            scale: toNumber(data.scale, 1),
            el: el
        };
    if ( !el.id ) {
        el.id ...