Jump to content

App. HTML. How to link to much text in another html file?

Recommended Posts

I am creating an app with much text-information. So what is an easy way to link all the text and pictures to the index.html file? Using iframe?


When using iframe only 3-4 cm of the text shows…

<iframe id="iframeGeo" src="teoritekst/page7Geology.html" frameborder="0" height="100%" width="100%"></iframe>


In the index.html file I have this code:

<div data-role="page" id="page8Production"> <div data-role="header" id="txtHeader"> <h1>Produksjon</h1> <a data-role="button" id="btnBack" href="#page6Knowledge" data-inline="true">Back</a> </div> <div data-role="content"> <div class="div-widget"> <div> <blockquote class="txthistorie"> <span id="txtInfo"><h1>Utvinnning</h1></span> <a href="" class="thumbs"><img src="images/plattform.png style="width:304px;height:228px"/></a> <p>very much text here, therfore I have to link to another htmlfile. I cannot write all this in index.html</p> </blockquote> </div> </div> </div>


In this application, there are some buttons, when clicking them you can read a lot of text.

This hurry bit, so grateful for all the answers. Sorry for my bad english.


Link to post
Share on other sites

It is possible that the height is being constrained by its parent element. Without a more complete structure which would be available if you posted a lin, it is not possible to do a detailed diagnostic.

Link to post
Share on other sites

When using this iframe and new style in index.html, I am now able to se the text, but not the pictures:

<div data-role="page" id="page9xxx">

<div data-role="header" id="txtHeaderSub">


<a data-role="button" id="btnBack" href="#xxx" data-inline="true">Back</a>


<iframe src="teoritekst/pagetext.html" style="width: 100%; height:1500px" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0"></iframe>

</div>pagetext.html looks like this:

<div class="xx">

<blockquote class="page9xxx">

<span id="txtInfo"><h1>Title</h1></span>

<p>text here</p>

<a href="" class="thumbs"><img src="images/picture.png" style="width:663px;height:300px"/></a>

<p>text here</p>


</div>Any idea why image does not appear??

Link to post
Share on other sites

The picture location is relative to the location of the file. If the file is in a different folder, you need to change the src attribute of the <img> elements to match the new directory structure.


Your page seems to be inside a folder "teoritekst", so you need to move up one directory: <img src="../images/picture.png"

  • Like 1
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...