• Register
Welcome to the in5 Answer Exchange! This a place to get answers about in5 (InDesign to HTML5) and make requests.
0 votes
I make magazines that include Business Listings. I pull these listings from a database and display them in an iframe. That works great on everything EXCEPT Safari Mobile. Phone and email links within the iframe on Safari mobile do not work correctly.

So, only a couple of results can be seen without scrolling so scrolling through the results is a must. I use the single file, page peel flipbook style with the Control Frame at the bottom. Is there any way to have a long page that scrolls and still have the control frame without using an i-frame?

Here is an example book, the listings are on the last page (you can click the Table of contents button, I have it going straight to the listing instead of the TOC): http://chambervu.com/liberty/index.php
asked in how_to by (290 points)
    
Here is a code snippett of what I am currently using. After index.html is created by In5, I plugin this code in the HTML boxes and rename to index.php:

 <li class="page" data-name="93">
    <div class="page-scale-wrap"><img src="assets/images/blank.gif" class="pageItem hd" alt="Referral AND Relocation Guide 2018 Chamber of Commerc" id="item26663" data-src="assets/images/item_26663.png"/><img src="assets/images/blank.gif" class="pageItem hd" alt="Category " style="left:37px !important;top:184px !important;" id="item26576" data-src="assets/images/item_26576.png"/>
      <div id="item26599" class="pageItem embed-container" style="width:200px !important; height:16px !important; left:128px !important;top:184px !important;" alt="HTML"><?php
error_reporting(0);
$conn = new mysqli("localhost","","","") or die($this->mysqli->error);
$result = $conn->query("select DISTINCT Bus_categories from cmsb_frisco ORDER BY Bus_categories ASC");
    
    echo "<form action='catlist.php' style='width: 500px' target='searchFrame' method='get' >";
   
    echo "<select style='font-size:14px;height:20px;' name='category_select' onchange='this.form.submit()'>";
    echo "<option  value=''selected>Select Business Category</option>";
    while ($row = $result->fetch_assoc()) {

                  unset($name);
                  
                  $name = $row['Bus_categories'];
       
                  echo '<option  value="'.$name.'">'.$name.'</option>';
                 
}


    echo "</select></form></br></br></br>";
?></div><img src="assets/images/blank.gif" class="pageItem hd" alt="Alphabetically " style="left:37px !important;top:231px !important;" id="item26603" data-src="assets/images/item_26603.png"/>
      <div id="item26626" class="pageItem embed-container" style="width:200px !important; height:16px !important; left:160px !important;top:231px !important;" alt="HTML"><form name="alphasearch" action="ialphalist.php" target="searchFrame">
      
        <select style="font-size:14px;height:20px;" name="alphasearch" onchange="this.form.submit()">
          <option value="" selected>Select the First letter of the Business Name</option>
          <option value="[0-9]">0-9</option>
          <option value="a%">A</option>
          <option value="b%">B</option>
          <option value="c%">C</option>
          <option value="d%">D</option>
          <option value="e%">E</option>
          <option value="f%">F</option>
          <option value="g%">G</option>
          <option value="h%">H</option>
          <option value="i%">I</option>
          <option value="j%">J</option>
          <option value="k%">K</option>
          <option value="l%">L</option>
          <option value="m%">M</option>
          <option value="n%">N</option>
          <option value="o%">O</option>
          <option value="p%">P</option>
          <option value="q%">Q</option>
          <option value="r%">R</option>
          <option value="s%">S</option>
          <option value="t%">T</option>
          <option value="u%">U</option>
          <option value="v%">V</option>
          <option value="w%">W</option>
          <option value="x%">X</option>
          <option value="y%">Y</option>
          <option value="z%">Z</option>
        </select>
      </form></div>
      <div id="item26631" class="pageItem scroll-vert" alt="Rectangle">
        <div id="item26632" class="pageItem embed-container" style="width:504px !important; height:1608px !important; left:5px !important;top:1px !important;" alt="HTML"><iframe src="" height="1600px" width="500px" name="searchFrame">&nbsp;</iframe>
        </div>
      </div><img src="assets/images/blank.gif" class="pageItem hd" alt="Browse by " style="left:37px !important;top:156px !important;" id="item26636" data-src="assets/images/item_26636.png"/>
    </div>
  </li>

1 Answer

0 votes
 
Best answer
You could use the Scrolling Frame add-on:
http://ajarproductions.com/scroll/?ref=aexch
answered by (147k points)
selected by