Do you mind sending the latest Hype file that you posted an HTML dropbox link for?
The file I posted above will help with this. It has the same calculations in it.
It may have the same calculations, but it doesn't work with the overflow-y function in the way that I want it to. The way the "Fixed-Background-Picture.hype" file was sent to me, the content was placed within the editor boundaries. When I moved some content below to the overflow area, it disappeared. Hans' file worked with the file I provided. There were just a few minor issues that I can live with, but only the HTML link was provided, not the Hype file.
I posted a new one.
it’s accidently saved within beta. i can offer it when the new version is published.
have you tested @DBear 's file instead?
Yes, that's the one I tried and it didn't work with the overflow-y like the one you posted did. Any idea when the new version will be published?
@jonlangberg4896
I have posted 2 files in total fixedHeader.zip and fixedElements.zip
fixedElements.zip is a new file that the overflow-y works as well as a background fixed image and it runs a javascript function that calculates the heights (the same function as is used in the file that h_classen posted)
Please note that these are all hacks and that the new version of Hype should make this kind of use much easier to implement.
I can't get this to work with my file in the same way. Not sure what I am doing wrong, but here is the file before calculating the heights: Commercial-Page.hype.zip (634.7 KB)
If there is one problem that I must fix while still maintaining the overflow-y feature and the sticky header, it is fixing the scrollbar problem that I just found out about. Using the original method as shown in the linked file, when you click the top of the scrollbar when it's flush with the top of the sticky menu, it cannot be selected, it's somehow covering the scrollbar. When you try to grab onto it and drag the scrollbar down in the space where the menu is, the screen shifts to the left, leaving blank white space on the right. You can grab and drag the scrollbar if you click below the menu though.
Hi Jonathan
Here is a merger of your project and my document. I hope it’s ok. Still needs work for your needs but:
• fixed the scroll problem
• menu and background image are fixed position
• overflow is working (a little work needed here for the position of the content)
I have added a few things too 
Hope you like. Please don’t break it 
Only kidding! Break away. Best way to learn!
fixedElementsv2.hype.zip (483.3 KB)
1 Like
Hi Hans,
Now that 3.5 came out, do you mind sending me the file that worked well? Here was the original link you sent to the exported HTML/JS files: https://dl.dropboxusercontent.com/spa/3ftsuc9opmid3j4/Exports/Fixed-Background-Picture/Fixed-Background-Picture.html
Perfect! Works really well! Is there any way to unapply the overflow function when you shrink the browser size and it switches to the mobile view? Check out what happens when you load this site with the browser stretched out to past 768px, then drag the browser to the point where it breaks to the 320px iPhone layout. Somehow, the overflow function that runs on scene load in the 960px view affects the mobile layout even though none of the same element IDs are included in the mobile version. When you shrink it to mobile view and then refresh the page, it looks as it should, so the common denominator is the overflow function.
Fixed Background File.hype.zip (1.5 MB)
yes, it wasn’t supposed to work with layouts …
replace:
var thisSceneId = $(".HYPE_scene[aria-hidden='false']").not(".HYPE_element").attr('id');
positioning();
window.onload = window.onresize = function(){positioning()}
function positioning(){
var wHeight = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
var cHeight = hypeDocument.getElementProperty(hypeDocument.getElementById('content'), 'height');
var sceneHeight = wHeight + cHeight + 'px';
$("#" + thisSceneId).css({'height': sceneHeight});
$('#' + hypeDocument.documentId()).css({'height': sceneHeight});
}
you’ll need onsceneloadscript for your layout too
positioning();
window.onload = window.onresize = function(){positioning()}
function positioning(){
var thisSceneId = $(".HYPE_scene[aria-hidden='false']").not(".HYPE_element").attr('id');
var sceneHeight = $("#"+ thisSceneId).css('height');
$('#' + hypeDocument.documentId()).css({'height': sceneHeight});
}Great! Thank you so much for all of your help!!
I am trying to get a sticky navigation bar which goes back in place working with the last file jon send.
But the bar always jumps right on top, when i start scrolling - what am i doing wrong?
In the header i put:
<style>
.sticky{
position: fixed !important;
}
</style>
than i run a function on sceneload
lastPos = {
y1 : 0,
y2 : 0
}
el = hypeDocument.getElementById('menu');
sPos = el.getBoundingClientRect().top;
window.onscroll=function(){
wY = window.pageYOffset || (document.body.scrollTop || document.documentElement.scrollTop) ;
lastPos.y1 = lastPos.y2; lastPos.y2 = wY;
if(wY >= sPos){
el.style.left = null;
el.style.margin = 'auto';
el.style.top = '0px';
el.setAttribute("class","sticky");
}
if (lastPos.y2 < lastPos.y1 && wY <= sPos){
el.style.top = sPos + 'px';
el.setAttribute("class","");
}
};Thanks for making such a versatile and robust HTML5 editor! I always appreciate the support I get from the e-mail I send in from time to time.
May I suggest making this a feature so it becomes a built-in capability for Hype 3.6?
Anyways, thanks again!
2 Likes
What can I do to make it work with layouts?
+1 on that…
(regarding making it a 3.6 feature)
1 Like
Great example. but still I do not how to use you example in my project.
In wordpress, it is very easy to build a page with fixed background image, and put text content on that background image by using a page builderl composer.
But it is difficult to do that in Hype, is it possible to make it as build-in fuction?
I even I can not find the element of image, where it come from?
Alex
which is a feature request ... 
so you may post it as such in a single thread