Adding double pages to a turnjs "book"

I have a created a website where visitors can skim through a book using turnjs. I have the pages as jpgs of double pages and I want them to be loaded dynamically.

Here's the code:

var flipbook = $('.flipbook');  
flipbook.turn({
    elevation: 50,
    gradients: true,
    autoCenter: true,
    pages: 118,
    when: {
      missing: function (e, pages) {
        for (var i = 0; i < pages.length; i++) {
          var n = pages[i];
          if(!$(this).turn('hasPage',pages[i])) {
            var pagenum = Math.floor(pages[i] / 2) + 1,
                src="url(/pages/page_" + pagenum + ".jpg)",
                element = $('<div />',{'class': 'double', css:{backgroundImage:src}});
            flipbook.turn('addPage',element,n);
          }
        }
      }
    }
});

<div class="flipbook">
<!-- Insert content dynamically -->
</div>

Unfortunately this doesn't work like I want it to, here's what's happening:

The code as I posted it above inserts the pages, but every double page is just scaled to 50% of its width an put on one page. for example, on page 4 I have what should be page 4 & 5 and on the left page I have the same as on its right neighbor.

I changed the last line to flipbook.turn('addPage',element); hoping that it would automatically add two pages, but then the first page inserted is .p113 and not .p1

I also changed my code to

if(0 == n%2 && !$(this).turn('hasPage',pages[i])) {
  var pagenum = Math.floor(pages[i] / 2) + 1,
      src="url(/fileadmin/kollektion/2015/pages/page_" + pagenum + ".jpg)",
      element = $('<div />',{'class': 'double', css:{backgroundImage:src}});
      element.scissor();
      flipbook.turn('addPage',element,n);
  }
}

But that resulted in only getting the left pages inserted.

So, what's the best way to dynamically add double pages using addPage? I couldn't find anything about that in the documentation or the examples.

Since the images that are my pages are put in the background of a <div>, the trick is to add some styles to scale the background images and position them accordingly:

.double{
    background-size:200% 100%;
}

.double.even {
    background-position: 0% 0%;
}

.double.odd {
    background-position: 100% 0%;
}