ialfar0
Level 1 (0 points)

Q: slider bar not working

I am creating an interactive epub in which the user can select a value by using a slider bar. I am using xhtml files and and input type="range" to create the slider.

When the slider is on the first page of the book, it works properly. However, when the slider is on the second page, when I touch it the marker goes to the right part of the slider and it is impossible to select any other position.

I write you an example of the xhtml file:

 

 

<?xml version="1.0" encoding="utf-8" standalone="no"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

  <title>Example of slider bar problem</title>

   <link charset="utf-8" href="./Styles/main.css" media="screen" rel="stylesheet" type="text/css" />

   <link charset="utf-8" href="./Styles/plot.css" media="screen" rel="stylesheet" type="text/css" />

</head>

  <body>

<h3>Example of slider bar problem</h3>

<h1 id="heading_id_2">Subtitle</h1>

<canvas id="canvas" width="340" height="415"></canvas>

<p>Lorem ipsum dolor sit amet, suspendisse nulla pretium, rhoncus tempor placerat fermentum, enim integer ad vestibulum volutpat. Nisl rhoncus turpis est, vel elit, congue wisi enim nunc ultricies dolor sit, magna tincidunt. Maecenas aliquam est maecenas ligula nostra.</p>

<form action="#" id="inputdata" method="">

    <dl>

      <dt><label for="wdim">Temperatura :</label></dt>

      <dd><input id="wdim" max="1" min="0" name="wdim" step="0.01" type="range" value="0.5" /> <span class="error" id="resw"></span></dd>

    </dl>

  </form>

  <div style="clear: both;"></div>

  <script charset="utf-8" type="text/javascript">

    //<![CDATA[

    window.addEventListener("load", ui.init, false);

    //]]>

  </script>

 

 

If I create the epub and I open in my ipad3, the slider is on the first page and everything is OK. But if i select a bigger type font, the slider is now on the second page and doesn't work.

Any suggestion?

iPad

Posted on May 16, 2012 4:17 AM

Close
ialfar0

Q: slider bar not working

  • All replies
  • Helpful answers

  • by K T,

    K T K T May 16, 2012 9:11 AM in response to ialfar0
    Level 7 (23,844 points)
    Publishing
    May 16, 2012 9:11 AM in response to ialfar0

    But if i select a bigger type font,

    What fonts are you using?

     

    Have you confirmed they exist on iOS/iPad?

  • by ialfar0,

    ialfar0 ialfar0 May 17, 2012 1:28 AM in response to ialfar0
    Level 1 (0 points)
    May 17, 2012 1:28 AM in response to ialfar0

    Sorry, I didn't explain very well when I found the problem, it is not about the type font but the size font.

    The problem appears when I try to read the book. For the same book, if the slider is on the first page there is not problem. When it is on the second page, it doesn't work. To move the slider from one page to the other using only the ipad one possibility is to touch on the ritght upper part of the book the symbol with the small and big A and to enlarge the size. Another way to get the slider on the second page is to rotate the ipad, putting it horizontally and thus reading two smaller pages at the same time. Also I found the problem when I tried to read the book using an iphone, with a smaller screen.

     

    I am using Anthemion eCub to create the epub. Could it be the problem?

     

    I have written a simple page just with some text and the slider, and the problem is still there.

     

    <?xml version="1.0" encoding="utf-8" standalone="no"?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

      "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

     

    <head>

       <title>Example of slider bar problem</title>

    </head>

     

    <body>

       <p>Lorem ipsum dolor sit amet, suspendisse nulla pretium, rhoncus tempor placerat fermentum, enim integer ad vestibulum volutpat. Nisl rhoncus turpis est, vel elit, congue wisi enim nunc ultricies dolor sit, magna tincidunt. Maecenas aliquam est maecenas ligula nostra.</p>

       <p>Lorem ipsum dolor sit amet, suspendisse nulla pretium, rhoncus tempor placerat fermentum, enim integer ad vestibulum volutpat. Nisl rhoncus turpis est, vel elit, congue wisi enim nunc ultricies dolor sit, magna tincidunt. Maecenas aliquam est maecenas ligula nostra.</p>

       <p>Lorem ipsum dolor sit amet, suspendisse nulla pretium, rhoncus tempor placerat fermentum, enim integer ad vestibulum volutpat. Nisl rhoncus turpis est, vel elit, congue wisi enim nunc ultricies dolor sit, magna tincidunt. Maecenas aliquam est maecenas ligula nostra.</p>

     

      <form action="#" id="inputdata" method="">

        <dl>

          <dt><label for="wdim">Temp :</label></dt>

          <dd><input id="wdim" max="1" min="0" name="wdim" step="0.01" type="range" value="0.5" /> <span class="error"        id="resw"></span></dd>

        </dl>

      </form>

     

    </body>

     

    </html>

     

    Thank you so much

  • by MichiHenning,Helpful

    MichiHenning MichiHenning May 17, 2012 3:11 AM in response to ialfar0
    Level 4 (1,350 points)
    May 17, 2012 3:11 AM in response to ialfar0

    This smells like a bug. I would try to simplify more, pulling the slider out of the form, and removing JavaScript code, so you start with the simplest possible scenario.

     

    Michi.

  • by ialfar0,

    ialfar0 ialfar0 May 17, 2012 5:53 AM in response to MichiHenning
    Level 1 (0 points)
    May 17, 2012 5:53 AM in response to MichiHenning

    Thanks

    I have tried this, now I have only some plain text and the slider:

    <input type="range" name="rango" />

    and the problem is still here.

  • by MichiHenning,

    MichiHenning MichiHenning May 17, 2012 6:02 AM in response to ialfar0
    Level 4 (1,350 points)
    May 17, 2012 6:02 AM in response to ialfar0

    Looks like a bug then. If you haven't already, join the Apple Developer Program (free) and report the bug. That's probably the best way to get their attention. I've received timely and construtive replies from developers in response to bugs I reported.

     

    I wouldn't bother with the iBooks Author Feedback thing. They must be getting 2000+ messages a week from people who think they know precisely what iBooks Author should look like…

     

    Michi.