1. Due to the recent site upgrade, the iPadForums (iPF) App will no longer work. The new iPadForums.net website has been designed from the ground up to work perfectly from any mobile, tablet, or desktop computer using the built in internet browser. Create a shortcut to iPadForums.net on your home screen by following these steps: Create an icon for iPadForums.net

How do i keep <svg> snippet at the top of ibooks page?

Discussion in 'iBooks' started by apple dave, Aug 23, 2012.

  1. apple dave
    Offline

    apple dave iPF Noob

    Joined:
    Aug 22, 2012
    Messages:
    1
    Thanks Received:
    0
    Trophy Points:
    0
    Location:
    scotland
    Ratings:
    +0 / 0
    I am working on Xlinks within SVG graphics for ePub to publish in iBooks.

    I put the SVG code directly into the XHTML page as the xlinks do not work properly if i use an <img>, <object>, <iframe> or <embed> tag.

    When i look at the graphic on safari browser or ibooks it is positioned in the middle of the page, leaving white space above and below and often pushing next page contents further away.

    Is there any way to anchor and keep the position of the graphic at the top of the ibooks page. I have been fiddling about with the viewbox to make a view that exactly fits ibooks pages but is not proportional to a lot of my graphic which are more square.

    I basically want to keep the graphic image fixed at the top of the ibooks page directly under <h3>.

    I think I'm missing a trick somwehere?

    This is some code to illiustrate my problem. Basically, i have an xlink purple dot in a blue square that want to keep at the top of ibook screen with the header.........If i get this sorted i can upload my books....... Help!..... Dave

    ps.... i had no remove the namespace links below to be able to post....


    <?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "">
    <html xmlns="">
    <head>
    <title>PURPLE DOT</title>
    <link href="../Styles/styles.css" rel="stylesheet" type="text/css" />
    </head>
    <body><div>
    <h3>Chapter 1</h3>
    <svg
    xmlns=""
    version="1.1"
    xmlns:cc=""
    xmlns:xlink=""
    viewBox="0 0 523.47 405.5"

    >
    <g transform="translate(1.5,-276.40625)">
    <path stroke-linejoin="miter" d="m0,277.91,0,402.49,520.47,0,0-402.49z" stroke="#000" stroke-linecap="butt" stroke-width="1px" fill="#e3f9f6"/>
    <path stroke-linejoin="miter" d="m0,277.91,0,402.49,520.47,0,0-402.49z" stroke="#000" stroke-linecap="butt" stroke-miterlimit="4" stroke-dasharray="none" stroke-width="3" fill="none"/>
    <a xlink:href="chapter02.xhtml#_lander">
    <path d="m290.07,477.77a49.965,49.965,0,1,1,-99.93,0,49.965,49.965,0,1,1,99.93,0z" fill-opacity="0.79215686" fill-rule="evenodd" fill="#8a3089"/>
    </a>
    </g>
    </svg>
    </div>
    </body>
    </html>

Share This Page