Hello.I looked at your site in Mozilla Firefox 73.0.1, Opera 66.0.3515.103, Google Chrome 80.0.3987.116, Microsoft Edge 80.0.361.57. Parallax works the same everywhere.

Hi Aleksej.

Thank you for your respons. But on my computer it does not work on Edge. I have Microsoft Edge  44.18362.449.0. Also on my IPhone the pictures are fixed. In Chrome, Mozilla and on the IPad it works.

Regards, Ruud

Thank you Claudio for your respons! It's a shame that parallax no. 1 has been disabled for Edge. But at least now I know why. Hopefully you can find a solution for the near future .

in old Edge has been disabled

in new Edge Chromium it's ok ! ;-)

i'm a user like you. i'm not a member of the STAFF Incomedia.

And the future of Edge is Edge Chromium

So now I tried parallax no. 3. This should work perfectly. But unfortunately it is not. It works correct on Edge, Chrome and Mozilla. But on Safari it is a mess.

I put the picture in the center. But on Safari only the far top of the picture is shown. And it scrolls together with the page (see attached picture from my IPad). While it should be fixed in the background. Am I doing something wrong? 

Or maybe it is better just to skip this complete parallax thing. But, in this case, why is it in the program, when it is not working correctly on all the browsers. Aspecially on those who are used the most, Edge and Safari ??

By the way, on the IPhone 11 the picture is also fixed (so it scrolls together with the page), but it is shown correctly. See attached.

In the meantime I tried a few things. But, unfortunately, nothing is working on all the browsers. I tried (on the -Onze Honden in huis- page, https://www.fawltyandjones.nl/test/in-huis.html) to put a picture on the background in Page Properties - Grafic, see attached. This works on Edge, Chrome and Mozilla but not in Safari on the IPad and IPhone. The image is not getting resized. It depends on how much text you have on the page, how big the picture on the background gets.

I had the same problem in my old project (which is still on line now). Which I asked help for in 2017, post number 164341. But then Claudio D. told me he could not help me, because I had wrong html codes in it. Now I am having the same problem, with a new project in which are no customer html codes. The problem exists only on the mobile devices.

So now I tried all the possibilities for having a picture on the background fixed or not. But nothing works on all the browsers/devices. So maybe you can give me a solution for getting a picture on the background of each page. I want to have a different background picture on each page.

(It > En ) ... ... if this > my invention  (among some of my experiments)  works on your devices i(!), then you can use it in your Project ...
... possibly, and if you are interested,   notify me if you want to know more and how to incorporate it into the Project... (it's simple and easy)...

hello, ciao

.

@ KolAsim

I took a look at your invention. But on the IPad and IPhone the picture is not fixed in the background. It is scrolling together with the rest of the page. On Edge it works just fine.

But maybe you can tell me how did you do that, so I can try it in my own project.

... try these other examples of mine:
> example 2
> example 3
> example 4

> example 5   

.

Hi KolAsim,

Example 2 and example 3 are working on all the browsers. Also on Safari! On the IPhone the picture resizes a bit during scrolling, but that is not disturbing that much.

So I am curious, how did you do that??

Kind regards, Ruud

... for the "in-huis.html" page paste the following code in this position:
>> Step 3 - Map > The Page Properties window > ▪Expert | ▪Custom Code: (5°)  >▼After opening the BODY tag
... code:
<div id="contenitoreK" style="position:fixed;top:0px;width: 100%;height: 100%;z-index:-1;">
<div id="div_customK" style="position:absolute; top:0px;width: 100%;height: 100%;z-index:-1; background-repeat: no-repeat;
background-image: url('https://www.fawltyandjones.nl/test/images/queeny-en-motion-2500x1800.jpg');
-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;
background-size: cover;background-position: center center;">
</div>
</div>
<script> document.getElementById("imPageExtContainer").style.backgroundImage = "url('')"; </script>

.

ciao

But, do I understand this correctly? When I put this on each page into my project in the test environment, I am able to check if everything looks the way I want to. But when I finish the project, and I want to place it in the correct url (www.fawltyandjones.nl), then I have to change all the url's (on each page) of the backgroundimages manually. This will not change automatically?

... step 3 is relative to each single page, therefore each page must have the same style and its dedicated script, and the URL of the image must be replaced with the relative one ...

background-image: url('images/nameimge.jpg');

.

Thanks for your time

... ... try this code, which should automatically replace the image:

<div id="contenitoreK" style="position:fixed;top:0px;width: 100%;height: 100%;z-index:-1;">
<div id="div_customK" style="position: absolute; top: 0px; width: 100%; height: 100%; z-index: -1; background-repeat: no-repeat; background-image: url(''); background-size: cover; background-position: center center;">
</div>
</div>
<script>
imagebgK = $("#imPageExtContainer").css('background-image');
$("#div_customK").css("background-image", ''+imagebgK+'' );
$("#imPageExtContainer").css("background-image", "url('')" );
</script>

.

Okay thanks! I will try that.