Parallax 
Auteur : Cliff G.Very Very Very disappointed! did I say VERY!
I have spend over 30 hrs playing with Row Formats and Parallax OMG
I looked up the most used screen sizes and added them to Resposive Design.
I have resized images, added extra views, uploaded site over 100x ... why you ask?? Because the build in Web Preview shows you pretty much what you want... but supprise is when you upload the site!
What you see in Preview is not what you see on the same size screens in real life.
So I found the BEST FIX.... DON'T USE PARALLAX
By Not using this fancy feature ... will save you a lot of Time
By Not using this fancy feature ... reduce chances of Heart Failure
By Not using this fancy feature ... lower the probability of needing medication
Don't get me wrong... this is great software. Just don't expect "bells & whistles" to properly work.
Please remove the Parallax Feature until you get it fixed because you are misleading people.
Cliff, you say that in preview you can see parallax effect pretty much as you expect. My experience is that if it looks good in preview it looks just as good online.
Are you aware that it is frequently required that you clear your browser cache after upload (ctrl+F5).?
Could you provide screen shots of online versus preview or describe the differences?
When viewing online are you doing so on PC, tablet or mobile and if tablet/mobile is the device an apple?
Before uploading, can you preview on your device via QR code?
Cliff - does parallax work online for you with this example?
https://esahc.com/parallax
https://helpcenter.websitex5.com/fr/post/232356
Auteur
first i appologize for venting
1) I cant provide screen shots as i am working on idea thats has not been done.
2) Its been tried on iphone 6S, Ipad, Desktop.
- parallax works fine on desktop even if cache not cleared
- iphone on shows fixed pictures even when cache or history is cleared
Ipad (the largest) never shows the pictures as the iphone and desktop UNLESS Parallax is unchecked
QR code also does not work (for me anyway) I have tried it >10 times
So, here is everythig I have tried...
1) Resizing images to the largest width in Responsive Design settings
2) Locked the neccessary rows
- with separators
- without separators
3) Check off Parallax
- Parallax
- Fixed
- Inverse
4) Tried
- do not repeat
- fit to window
5) Tried
- backup
- exit
- load backup
6) Deleted everythig on server and reloaded (done once)
All combinations of 2,3.4 and 5 have been done.
I there a way I can contact you off site?... then I could give the address of the site.
Auteur
Ok so that example you provided works on my Iphone and desktop
So what would I be doing wrong?
Cliff, I have provided the project as an iwzip thru the thread https://helpcenter.websitex5.com/fr/post/232356
Be aware that this was created specifically to demonstrate how the proportions of a parallax image can be constrained by using a transparent image in the appropriate row. However, it will work with or without the image (simply apply the simple separator and specify height).
The only potential error I see in your screen shot are cells with no content. You must place an object in every cell (eg text, image, html, separator, etc) the object itself need not have content. WX5 is known to "not play nice" if there are empty cells on a page.
I doubt it will help, but should you wish to contact me directly you will find my email, contact form and all other contact details on my website https://www.esahc.com
Works fine for me on a variety of devices.
Auteur
Ok so I am getting somewhere lol
But first... the part were you say "there should not be empty spots on rows" ... I used the Chocolate Template which has those empty spots.
I followed the instructions on "transparent text box" found that the size of the transparent image that is put in the text box ... has to be the same size or close to the image for Parallax width - height
I works now works perfect on Desktop & Large Ipad.... but not on Iphone. Plus on the Iphone there is white space between the sections of linked (parallax) which has different pictures
Thank you for your help!
Cliff
Cliff - yes, the transparent image "trick" holds the proportions as various resolutions (but not suitable for use in your example).
White space? I do not understand sorry. Is the white "space" between the objects or because of the objects? Are you referring to the image on the right hand side of rows 7, 8 & 9 or are there images in the text objects?
Try adding 2 text objects as shown (without content)
(I do not know who created Chocolate Template, but developers do not always follow "best practise" :-)
Auteur
Yes I am reffering to to two "T's" i called blank or white space which is exactly the same in the Chocolate template.
I expanded the "A" to the left and right to fill the whole width of row on all the rows of same empty space.
Anyway I fixed the page as per your sujestion. :)
I removed the "Transparent Text Box", what happend after removal was the image set to parallax lost the full height... meaning I could not see the whole image.
So I put it back in and Page works fine again on Ipad and desktop but still no Parallax on Iphone.. plus I get white space between the parallax sections (only on iphone)
I just don't know what else to do. The controlls and settings in X5 are easy to follow (besides the need for the transparent image)
No parallax on iPhone could be an issue for iphones in general or that particular OS. Does my example have parallax on the iphone? I have to admit, I thought parallax had been removed for display on mobiles until I realised it worked in my example on my phone, perhaps it remains disabled for iPhones only?
The white space could be removed by either making the bottom text object part of the row/formats group or editing the top inner and outer margins.
The text box with transparent image could be replaced with a simple separator and set the height (300??), but that would be a fixed height for all resolutions (I like the depth to reduce as the width reduces).
Perhaps you could provide a link once the page is online?
I am very pleased that you have had at least some success.
Auteur
your example works on my iphone. Something is causing my site not to work properly... question is what?
Actually, my site does not work on any of our iphones .. 2 Iphone 6S and 1 Iphone 10
Auteur
Just tried loading site on Samsung S10... that does not work either.
So since your example loads... mine only operates proper on Ipad and desktop. This prob means there is a wrong setting in my X5 or my server.
Cliff, I do not believe you have a setting wrong in either WX5 or your server, but you may be banging in to a limitation of what can be achieved with the parallax "feature".
I will contact you directly via email later today.
Cliff
It is of little or no consolation, but parallax is currently designed to be blocked on mobiles due to performance issues (I am still exploring why my example works)
https://helpcenter.websitex5.com/fr/post/230756
... v.16 ! ... ...
...
KolAsim - or course you are correct. Many thanks!!
(I created this in V16 to meet the needs of a user and had forgotten)
(It > En) ... ... a few years ago, I had invented the fixed parallax for all devices, the (!), etc .., for the WSX5.12 and later versions and still valid today ...
... currently I have been told in this Topic that the fixed parallax has been made possible by program in the current versions v2020.2+
>> https://helpcenter.websitex5.com/fr/post/232700#comment37
.
ciao
.
KolAsim is probably the most knowledgeable member of this X5 community.
Unfortunately, however, I rarely can understand his answers.
...
... with the current version v.2020.2+ the fixed parallax, i.e. with a fixed background image that does not scroll, also works on smartphones; ... in previous versions it didn't work, but in these versions my extra code worked, and it still works...
...
.
Auteur
That's great! Would you mind sharing this code here and to the developers of X5? lol
Also if you share... could you instruct on were to put the code?
Cliff
(It > En) ... my code, referring exclusively to the first image at the top of the page, is already shared and also available in my previous LINK, that is, here:
>> https://helpcenter.websitex5.com/fr/post/232700#comment8
... activates as requested below 720 pixels ...
... in your case, to be more precise, I would need to view your LINK in order to verify ...
... if you need other clarifications, let me know without problems ...
>> > Step 3 - Map> Page Properties> Expert Section | ▪Custom code: > 3rd option - Before closing the HEAD tag:
<style>
@media (max-width: 719px) {
#imPageRowGraphics_3 { background:transparent url('') !important }
#imPageExtContainer{ background-color:transparent !important}
html{ background: url('path_url/name_your_image.jpg') !important ;
background-position: center center !important; background-repeat: no-repeat !important;
-webkit-background-size: cover !important; -moz-background-size: cover; -o-background-size: cover !important; background-size: cover !important; background-attachment: fixed !important;}}
</style>
...!... ... depending on the host page, the ID number #imPageRowGraphics_3 ... may vary ...!...
.
ciao
.
P.S.: (... with the new version v.2020.2+ the EXTRA code would no longer be needed as it has already been activated by the developers...)
.