View Single Post
Old 09-02-2013, 05:08 AM   #251
DNSB
Bibliophagist
DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.
 
DNSB's Avatar
 
Posts: 46,754
Karma: 169712580
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Sage, Libra Colour, Lenovo M8 FHD, Paperwhite 4, Tolino epos
Quote:
Originally Posted by cgkr View Post
Is there a way to make all images in an ebook appear larger when transferring it to Aura HD? Perhaps a plugin?

A 400 x 100 image will show just fine on a Touch or Glo but will be completely illegible on the Aura HD.

I understand that one cannot create pixels out of thin air but I'd rather have an ugly legible picture that a pretty illegible one.
My preference is to use an SVG wrapper for all images. Instead of an line such as below:

Code:
<img alt="Cover" src="../Images/cover.jpeg" width="594" height="793" />
I would use:

Code:
  
<style type="text/css">
@page {padding: 0pt; margin:0pt}
            body { text-align: center; padding:0pt; margin: 0pt; }
</style>
</head>

<body class="nomargin">
  <div class="svg_wrapper">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 594 793" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image height="793" width="594" xlink:href="../Images/cover.jpg"></image>
    </svg>
  </div>
The nomargin and svg_wrapper are (probably) redundant in light of the @page styling but they are left over from when I was having fun using the <g> group tag when playing with rotating images.

Code:
.nomargin {
    display: block;
    margin: 0 0 0 0;
    text-align: center;
    }
.svg_wrapper {
    display: block;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    text-align: center;
    }
The advantage to using an SVG wrapper is that the image will be displayed using as much as possible of the display area. The sizes in the viewbox, height and width are more the aspect ratio and not the image size. Using any representation of the image aspect ratio there works equally well -- 600, 800 or 3, 4 will give the same results.

Regards,
David
DNSB is offline