WebSite X5Help Center

 
Cliff G.
Cliff G.
User

Parallax  en

Autor: Cliff G.
Besucht 1657, Followers 1, Geteilt 0  

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.

Gepostet am
21 ANTWORTEN - 7 NüTZLICH
Esahc ..
Esahc ..
Moderator

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?

Mehr lesen
Gepostet am von Esahc ..
Cliff G.
Cliff G.
User
Autor

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.

Mehr lesen
Gepostet am von Cliff G.
Cliff G.
Cliff G.
User
Autor

Ok so that example you provided works on my Iphone and desktop

So what would I be doing wrong?

Mehr lesen
Gepostet am von Cliff G.
Esahc ..
Esahc ..
Moderator

Cliff, I have provided the project as an iwzip thru the thread https://helpcenter.websitex5.com/de/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

Mehr lesen
Gepostet am von Esahc ..
Adrian B.
Adrian B.
User

Works fine for me on a variety of devices.

Mehr lesen
Gepostet am von Adrian B.
Cliff G.
Cliff G.
User
Autor

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

Mehr lesen
Gepostet am von Cliff G.
Esahc ..
Esahc ..
Moderator

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" :-)

Mehr lesen
Gepostet am von Esahc ..
Cliff G.
Cliff G.
User
Autor

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) 

Mehr lesen
Gepostet am von Cliff G.
Esahc ..
Esahc ..
Moderator

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.

Mehr lesen
Gepostet am von Esahc ..
Cliff G.
Cliff G.
User
Autor

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

Mehr lesen
Gepostet am von Cliff G.
Cliff G.
Cliff G.
User
Autor

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.

Mehr lesen
Gepostet am von Cliff G.
Esahc ..
Esahc ..
Moderator

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.

Mehr lesen
Gepostet am von Esahc ..
Esahc ..
Esahc ..
Moderator

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/de/post/230756

Mehr lesen
Gepostet am von Esahc ..
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Esahc ..
... ... ... (I am still exploring why my example works) ... ... ... 

... v.16 !   ... ... wink...

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Esahc ..
Esahc ..
Moderator

KolAsim - or course you are correct. Many thanks!!

(I created this in V16 to meet the needs of a user and had forgotten)

Mehr lesen
Gepostet am von Esahc ..
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

(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/de/post/232700#comment37

.

ciao

.

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Myron A.
Myron A.
User

KolAsim is probably the most knowledgeable member of this X5 community.

Unfortunately, however, I rarely can understand his answers.

Mehr lesen
Gepostet am von Myron A.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Myron A.
KolAsim is probably the most knowledgeable member of this X5 community. Unfortunately, however, I rarely can understand his answers.

...foot-in-mouth... 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...wink...

.

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Cliff G.
Cliff G.
User
Autor
 ‪ KolAsim ‪ ‪
Myron A. 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...... .

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

Mehr lesen
Gepostet am von Cliff G.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Cliff G.
 ‪ KolAsim ‪ ... ... ... ... ... That's great! Would you mind sharing this code here ... ... ... ... ... 

(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/de/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...)

.

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪