I have a question regarding the new iPad 3 and iBooks. I'm trying to make a Fixed Layout Book and want to make full use of the great new Retina Display, however I can't get an image to display correctly at the full @2x resolution.
In my HTML I currently have the following sizes in my head declaration
<meta name="viewport" content="width=670, height=1004"/>
I also copied and changed the CSS from the Apple Fixed Layout sample code which looks like this
img.background {
width: 670px;
height: 1004px;
margin: 0;
top: 0;
left: 0;
z-index: -1;
}
.page {
width: 670px;
height: 1004px;
overflow: hidden;
}
The image I'm using is 1340px x 2008px so I thought it should just display correctly. I did a test with IBA and it seems to display the image perfectly so I know the iBooks 2 can support the larger image. Just wondering what I need to change?
Any help would be appreciated. Thanks in advance
There's a limit of 2 million pixels per image in iBooks. This didn't change with in iPad3 (yet, at least).
Page 47 of the iBookStore Asset Guide (4.8). "The following apply to working with images in Fixed Layout Books: - The maximum size is 2 million pixels per image. Larger images will be compressed resulting in lower image quality and slower performance."