Site not working in breakpoint 480

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Post Reply
User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 5:32 pm

Greetings,

I just used the Coming Soon template and added a 480 breakpoint. Removed the animations since they were not working on the breakpoint. In default everything shows up correctly.

At 480 breakpoint I cannot get the Contact box to display its contents, and the "Your Email Here" box and submit button end up on the far right beyond the page. If i remove the email editbox and the submit button then it works fine, but they are path part of the form and the layout grid. They should not need to be removed. These are part of the template, i did not add anything.

the site is at http://www.wefixiphonesdallas.com
the wbs is at http://www.wefixiphonesdallas.com/ComingSoon.wbs

Please advise.

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Fri Jan 05, 2018 6:14 pm

The form elements use scroll transitions where the position of depends on the scrollbar.
If there is no enough content below the form then the objects will never reach their final position.

Possible solutions:
- add more content below the form so the page get longer.
or
- adjust the properties of the scroll transitions so the animation is shorter.
or
- remove the scroll transitions.

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 7:04 pm

I tried tripling the height of the page. Still same issue. Also added content below the Form, did not work either. I shortened the duration from 3000 down to 100 and it still behaved the same way.

Can I just remove the scroll transition in the 480? and leave them on the default?

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Fri Jan 05, 2018 7:23 pm

No, you cannot remove the scroll transitions in specific breakpoints because they use JavaScript so they apply to the entire page.

However maybe this tip from the help (User defined variables) will be useful:
$SKROLLR_MOBILECHECK$
This option applies to scroll transitions: CSS3 Animations and Transitions
This option can be used to enable checks for mobile devices. Default is: false. which means that scrolling transitions are enabled on mobile devices.
Important note: Some (older) mobile browsers do not provide 'real' scrolling events, but only trigger a start and finish event so any scrolling effect only takes place when the user has stopped moving the page so the animation would happen all at once at the end.
More details:
https://github.com/Prinzhorn/skrollr#skrollrinitoptions

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 7:39 pm

Thanks, will look into it. I do not see animation manager as a selection. Where would I find it?

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Fri Jan 05, 2018 8:23 pm

You can find the Animation Manager in the Tools Menu.

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 9:56 pm

I do not have it. This is what my Tools Menu looks like

Image

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Fri Jan 05, 2018 10:00 pm

Maybe you have enabled 'Easy Mode'?
'Easy Mode' hides all advanced features.

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 10:10 pm

Yep! Found it.

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Fri Jan 05, 2018 10:31 pm

I am not seeing a property for SKROLLR in the project. How is it enabled? I see skrollr.min.js get included in the artifacts which are uploaded, but I am not finding the trigger point.

I tried setting $SKROLLR_MOBILECHECK$ to True in site-properties.user defined variables. It had no affect.

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Sat Jan 06, 2018 7:54 am

You will need to add it yourself via Site properties->>User defined variables (for advanced users only)

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Sat Jan 06, 2018 7:41 pm

I did that in Site Proerties-User defined variables, $SKROLLR_MOBILECHECK$ = true. No change in behavior. I also tried $SKROLLR_MOBILECHECK$ = True.

What is surprising is that the site works perfectly in 480 on Firefox with all the animations, just not in chrome or opera. So it will work 12% of the time.

User avatar
Pablo
 
Posts: 13052
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Site not working in breakpoint 480

Post by Pablo » Sat Jan 06, 2018 10:35 pm

Not all mobile browsers may have implemented this functionality.
Unfortunately I have no control over that. I have only made the tools available for you so you can use them more easily on your website.

User avatar
Magical
 
 
Posts: 112
Joined: Thu Dec 14, 2017 5:08 pm
Contact:

Re: Site not working in breakpoint 480

Post by Magical » Sun Jan 07, 2018 4:21 am

Pablo,

In no way am I blaming you. The tool is fantastic. I really appreciate the stellar support. Learnt a lot about responsive design. The customer likes the animation on the desktop I just have to convince them that it is not a good idea for mobile. My reason for posting the issue was see if there were any other options i could take.

Post Reply

Who is online

Users browsing this forum: No registered users and 6 guests