it seems like there's a bug in the slider as it appears to mess up the content as the messages appear overlaying each other and the content is NOT adjusting correctly on mobile devices.
no, unfortunately the problem persists on safari (also on iPhone obviously) while it seems to be ok on firefox.
We really need to fix the safari issue though.
Also could you please advise me on how to manage the dimension of the resized header on mobile? as u can see it doesn't really hold the proportions with the rest of the page.
Sorry for the delayed response, I had to reach out to the dev team with this case and ask for their help, that is why it look longer to respond.
As I can see you have removed the slider from your site in the meantime. It's understandable as it was on the homepage and you wouldn't want to welcome your guests with it.
Unfortunately we cannot troubleshoot it further without seeing the problem and the slider. Could you please set up a test page where you can leave it up so the devs can investigate it and provide you with a solution ?
We've looked into this problem further and it seems to be caused by the timing settings you've applied on the slider.
As we can see there are a couple of settings that have incorrect values, causing this displaying error. Namely the Time Shifts, the Transition Durations and the Slide Durations.
I'd recommend to remove the values from these fields alltogether, as their current setup is not synergizing well. And enter 2-3 seconds (2000-3000ms) for the Slide Duration.
Please let us know whether this worked out better.
Unfortunately this doesn't seem to be the problem.
I corrected them but when I click on the first slide the second appear then I click again and you can see some broken movement underneath (like the 1st slide is trying to come back) but everything remains stopped.
Yes, you are right. Correcting those settings will not be enough in this case unfortunately. We have looked into the problem further, and found out that the error is caused by your theme.
html .ls-wrapper > a, body .ls-wrapper > a, #ls-global .ls-wrapper > a, html .ls-wrapper > p, body .ls-wrapper > p, #ls-global .ls-wrapper > p, html .ls-wrapper > h1, body .ls-wrapper > h1, #ls-global .ls-wrapper > h1, html .ls-wrapper > h2, body .ls-wrapper > h2, #ls-global .ls-wrapper > h2, html .ls-wrapper > h3, body .ls-wrapper > h3, #ls-global .ls-wrapper > h3, html .ls-wrapper > h4, body .ls-wrapper > h4, #ls-global .ls-wrapper > h4, html .ls-wrapper > h5, body .ls-wrapper > h5, #ls-global .ls-wrapper > h5, html .ls-wrapper > img, body .ls-wrapper > img, #ls-global .ls-wrapper > img, html .ls-wrapper > div, body .ls-wrapper > div, #ls-global .ls-wrapper > div, html .ls-wrapper > span, body .ls-wrapper > span, #ls-global .ls-wrapper > span, html .ls-wrapper .ls-bg, body .ls-wrapper .ls-bg, #ls-global .ls-wrapper .ls-bg, html .ls-wrapper .ls-layer, body .ls-wrapper .ls-layer, #ls-global .ls-wrapper .ls-layer, html .ls-slide .ls-layer, body .ls-slide .ls-layer, #ls-global .ls-slide .ls-layer, html .ls-slide a .ls-layer, body .ls-slide a .ls-layer, #ls-global .ls-slide a .ls-layer { display:block !important; }
This interferes with the slider's settings and messes it up completely.
As the problem is not generated in LayerSlider, we cannot solve it from our end unfortuantely. I'd recommend to contact Avada or the creator of the Avada child theme. They should be able to provide you with additonal details on this theme CSS that is being applied on the slider, and hopefully a solution as well.
it seems like there's a bug in the slider as it appears to mess up the content as the messages appear overlaying each other and the content is NOT adjusting correctly on mobile devices.
this is really urgent.
please help
Hello umbecalle9,
I have checked your site on mobile, but for me the slider is being displayed properly at the moment. There are no overlappings or misalignments.
Have you managed to fix the problem in the meantime ?
In case not, could you please specify on what OS/browser/device are you experiencing this exactly ?
hi Attila,
no, unfortunately the problem persists on safari (also on iPhone obviously) while it seems to be ok on firefox.
We really need to fix the safari issue though.
Also could you please advise me on how to manage the dimension of the resized header on mobile? as u can see it doesn't really hold the proportions with the rest of the page.
thanks
Umberto
Hello Umberto,
Sorry for the delayed response, I had to reach out to the dev team with this case and ask for their help, that is why it look longer to respond.
As I can see you have removed the slider from your site in the meantime. It's understandable as it was on the homepage and you wouldn't want to welcome your guests with it.
Unfortunately we cannot troubleshoot it further without seeing the problem and the slider. Could you please set up a test page where you can leave it up so the devs can investigate it and provide you with a solution ?
I've tried everything. with every single image also removing the text the slider is broken in safari.
I've put it back on with a 2 basic banners with a simple image, the sliding doesn't work.
please fix this
Thank you. My colleagues and I will look into this, and get back to you shortly.
We've looked into this problem further and it seems to be caused by the timing settings you've applied on the slider.
As we can see there are a couple of settings that have incorrect values, causing this displaying error. Namely the Time Shifts, the Transition Durations and the Slide Durations.
I'd recommend to remove the values from these fields alltogether, as their current setup is not synergizing well. And enter 2-3 seconds (2000-3000ms) for the Slide Duration.
Please let us know whether this worked out better.
Unfortunately this doesn't seem to be the problem.
I corrected them but when I click on the first slide the second appear then I click again and you can see some broken movement underneath (like the 1st slide is trying to come back) but everything remains stopped.
I've also updated the plugin and nothing changed.
please help
Yes, you are right. Correcting those settings will not be enough in this case unfortunately. We have looked into the problem further, and found out that the error is caused by your theme.
This CSS file http://umbertocallegari.com/wp-content/themes/Avada-Child-Theme/style.css contains the following entry:
html .ls-wrapper > a, body .ls-wrapper > a, #ls-global .ls-wrapper > a, html .ls-wrapper > p, body .ls-wrapper > p, #ls-global .ls-wrapper > p, html .ls-wrapper > h1, body .ls-wrapper > h1, #ls-global .ls-wrapper > h1, html .ls-wrapper > h2, body .ls-wrapper > h2, #ls-global .ls-wrapper > h2, html .ls-wrapper > h3, body .ls-wrapper > h3, #ls-global .ls-wrapper > h3, html .ls-wrapper > h4, body .ls-wrapper > h4, #ls-global .ls-wrapper > h4, html .ls-wrapper > h5, body .ls-wrapper > h5, #ls-global .ls-wrapper > h5, html .ls-wrapper > img, body .ls-wrapper > img, #ls-global .ls-wrapper > img, html .ls-wrapper > div, body .ls-wrapper > div, #ls-global .ls-wrapper > div, html .ls-wrapper > span, body .ls-wrapper > span, #ls-global .ls-wrapper > span, html .ls-wrapper .ls-bg, body .ls-wrapper .ls-bg, #ls-global .ls-wrapper .ls-bg, html .ls-wrapper .ls-layer, body .ls-wrapper .ls-layer, #ls-global .ls-wrapper .ls-layer, html .ls-slide .ls-layer, body .ls-slide .ls-layer, #ls-global .ls-slide .ls-layer, html .ls-slide a .ls-layer, body .ls-slide a .ls-layer, #ls-global .ls-slide a .ls-layer {
display:block !important;
}
This interferes with the slider's settings and messes it up completely.
As the problem is not generated in LayerSlider, we cannot solve it from our end unfortuantely. I'd recommend to contact Avada or the creator of the Avada child theme. They should be able to provide you with additonal details on this theme CSS that is being applied on the slider, and hopefully a solution as well.