I have a scene with internal links that start a new timeline, which simply opacifies some overlay arrows and labels over an existing image.
On iPhone or iPad, the scene jumps to the top when the link is clicked. Is there a way to stop this action and hold the scene in place?
I have also notice that the scene is too big for the iPhone or iPad window if the tabs are showing.
Or do I have to make the scene smaller so it just fills the iPhone/iPad window (so it cannot move)? And if I do so, will the tabs at the top of Safari be accounted for by the new size.
If you're linking to another scene, the scroll position shouldn't change unless the scene you're changing to has a different responsive layout configuration.
If you link to another .html page, the scroll position will be reset. If you're seeing scene changes change scrolling, can you share a document?
Unless you are making a web app (or embedding within an app), I wouldn't worry about the height of your document. The top tabs and URL bar shouldn't matter in your design. If your content is larger than the available screen area with tabs on (when first loading the page), the user can scroll down. The width of the top tabs will change when scrolling down so it's tricky to plan on that height.
Actually, you didn’t mention the situation I currently have. There is no change of scene, or link to another .html page. I am on the same scene, with a new timeline that opacifies arrows and labels overlying an image. Every time I tap the link to start this timeline, the webpage scrolls very quickly to the top. Is there a way to eliminate this action?
Also, my second question regards sizes of documents on an iPad or iPhone. If I use your built-in layouts, does that include the tabs? If not, the document must be scrolled just a bit to make up for this extra space at the top. I am trying to create my new layouts with elements close to the edge, which is why I ask this question.
Is it a 'mouse click action' that runs a timeline? Can you share an example document? I'm not sure why this would be happening.
The sizes defined in Responsive Layouts depend on the size that the browser reports back. You can get the size being reported back by running this script:
Currently, the doc was set up in the Layout panel, with a standard iPad landscape size.
It opens and operates fine on my iPad, but it is significantly larger than the available window. There’s a title bar and there are tabs. When I scroll up with my fingers, the tabs and a part of the title bar disappear, but the doc is still too big. Then, when I tap an internal link, the doc scrolls down, and the tabs and all of the title bar reappear.
I uploaded the document.
Daniel-I downloaded the Screen size measurer, and do not know how to use it. Am I supposed to open it on my iPad, for example? Could you please elaborate?
I figured out how to use the screen size measurer. I get measurements of 768 px wide & 1024 px tall in landscape mode on my iPad (note they are reversed from true width and height).
I double-checked the document I created, and it is 1024 x 768 px. Therefore, I believe my document is the correct size, but it is behaving badly for reasons I haven’t yet figured out.
In Hype reflect, the image exactly fills the iPad screen if the titlebar is off. If the titlebar is on, and if I scroll the document up a bit, I have the same issue with the document jumping when I tap on an internal link.
Yes you can open it in Hype and load it in any browser and it will return the screen size detected by running screen.width and screen.height.
Yes it does look like you will need to decrease the height of you document if you don't want to have any scrolling. ( I think reducing your document by 30 pixels should keep your document within the limit )
Thanks, Daniel. I did figure out how to use the screen size measurer, although it gave me the dimensions I expected.
Can you help me understand the issue? It seems like Hype Reflect won’t be of use, but perhaps I am doing something wrong. Is there a way to automatically correct for the tabs and title bar in iOS Safari?
First, its way, way more than 30 pixels, and I am still spending time trying to resize pixel by pixel to make it work. That is just not conducive to using the software, I’m afraid. And I’m making the document so small that I have to lose elements in it. That will mean a major replacing of the design.
Second, I can’t believe this is what was intended as its function. It doesn’t correlate with Hype Reflect at all.
Third, without accounting for the tabs and title bar, it looks pretty poor. Everything jumps whenever any part of the interface is touched.
I’m sure I must be missing something, and I apologize for being dense. Has anybody else had this trouble when trying to create a document for the current iPad and iOS?
Sorry, but one more item that I hope will be helpful, both for me and for others working with iPad documents:
As I make the document smaller, I am getting it to fit in the window of iOS safari. I can scroll up to make the tabs disappear and the title bar minimize. However, when I tap on an internal link (in other words, a link that uses the same scene, but starts a timeline that opacifies a label and arrows), the tabs reappear and the title bar enlarges again.
Is this something that can be controlled with Javascript in the internal link? Is there something I can put into the timeline to avoid this behavior?
Surely there is something related to this link that is making these events happen, because the chain of events only occurs when I tap on one of these links.
Surely there must be somebody out there with experience uploading a document to the web, and viewing it on an iPad.
