CSS Transform is forcing Safari to reload page

Question

I was building a slideshow using bookblock plugin from Codrops, demo can be found here - BookBlock A Content Flip Plugin

In all browser it works, but in iPhone safari, the page gets reloaded each time I load the page. I have searched the web, and found it can be due to CSS transform property, but I have to use that as the slider depends on it.

The main issue seems to be a dynamic slide scaling function, which I have written to scale the slides to fit in any window (Actual slide dimension is 2048x1536px).

app.scaleSlide = function () {
    var scaleValue = 1,
        slideWidth = 2048,
        slideHeight = 1536,
        newSlideHeight = 0,
        newSlideWidth = 0,
        mainWrapperTopMargin = 0;

    // decide if viewport is in portrait mode or in landscape mode
    if(($winW >= $winH) && ($winW - $winH > 210)) {
        // calculate scale value
        scaleValue = parseFloat ($winH / slideHeight);
        console.log('landscape: '+scaleValue);

        // calculate new slide height & width
        newSlideHeight = $winH;
        newSlideWidth = parseFloat((slideWidth * newSlideHeight) / slideHeight);
        console.log('landscape H W: '+newSlideHeight+'/'+newSlideWidth);
    }
    else {
        // calculate scale value
        scaleValue = parseFloat ($winW / slideWidth);
        console.log('portrait: '+scaleValue);

        // calculate new slide height & width
        newSlideWidth = $winW;
        newSlideHeight = parseFloat((newSlideWidth * slideHeight) / slideWidth);
        console.log('portrait H W: '+newSlideHeight+'/'+newSlideWidth);

        // calculate top margin of main wrapper
        mainWrapperTopMargin = parseFloat(($winH - newSlideHeight) / 2);
    }


    // assign new slide height & width
    $('.slide-main-wrapper').css({
        width : newSlideWidth+'px',
        height : newSlideHeight+'px',
        marginTop : mainWrapperTopMargin+'px'
    });

    // add zoom to the slide
    $flipBookOuter.css({
        '-webkit-transform' : 'scale(' + scaleValue + ')',
        '-moz-transform'    : 'scale(' + scaleValue + ')',
        '-ms-transform'     : 'scale(' + scaleValue + ')',
        '-o-transform'      : 'scale(' + scaleValue + ')',
        'transform'         : 'scale(' + scaleValue + ')'
    });

    // remove loader
    /*$loader.animate({top: '100%'}, 800, function (e) {
        $(this).remove();
    });*/

    // activate flipbook
    app.flipBook.init();

    // start animation
    //app.startAnimation();

 }