Responsive Issue

(Karl) #1


I have my main layout, intended to be viewed on desktop. I also have my variations for different mobile device widths. Is there a way to stop the versions intended for mobile popping up when I resize the desktop browser window to a narrower width? I have a different menu layout on the narrower mobile versions which I don’t want apearing when I’m viewing the site on the desktop. I just want the desktop version to fill the window (it has long pages so you scroll down to see the overflow) and just scale up and down as I resize the browser window. Hope that makes sense.

Here’s the desktop version…

And here’s the mobile version with the menu folded and unfolded…


Is there a layout stacking order?
(Hans-Gerd Claßen) #2

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

<script type="text/javascript" src="//"></script>
function layoutRequest(hypeDocument, element, event) {

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


  if("HYPE_eventListeners" in window === false) {
    window.HYPE_eventListeners = Array();
  window.HYPE_eventListeners.push({"type":"HypeLayoutRequest", "callback":layoutRequest});

(Karl) #3

Fantastic. Thank you for that, I shall have a go with that later today.