Avoid iPhone layout while on a computer?

1

Hello everyone,
I am creating a responsive website that has several different layouts per page. Is there a way/code that I can put in to avoid people seeing or going into the iPhone layout while on their computers and resizing the browser window smaller?

Thank you for any feedback.

Troy

2

the last hypeupdate provides that:
http://tumult.com/hype/documentation/3.0/#layout-functions

also:

may be of some help to detect wether mobile or not …

1 Like
3

this in the head should (hopefully) load only biggest layout when not mobile device …

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mobile-detect/1.3.5/mobile-detect.min.js"></script>
	
<script>
function layoutRequest(hypeDocument, element, event) {

var md = new MobileDetect(window.navigator.userAgent);
if (!md.mobile()){
var currSceneName = hypeDocument.currentSceneName(),
biggestSceneLayout = hypeDocument.layoutsForSceneNamed(currSceneName)[hypeDocument.layoutsForSceneNamed(currSceneName).length -1],
layoutName = biggestSceneLayout.name;
return layoutName
}else{
return false
}

  }

  if("HYPE_eventListeners" in window === false) {
    window.HYPE_eventListeners = Array();
  }
  window.HYPE_eventListeners.push({"type":"HypeLayoutRequest", "callback":layoutRequest});
</script>
3 Likes
4

Awesome, that script worked perfectly. Thank you so much.

5

Well, I think i spoke a moment to soon. It did work when you click on preview inside Hype. But after I exported the file and then viewed it that way the page came up blank for some reason. I tried it on several different files and in different ways all with the same result. I will still have to play around with it to get that to work, but that is close. Thank you.

6

add a protocol to the src

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/mobile-detect/1.3.5/mobile-detect.min.js"></script>

1 Like