OWL Slider: Text Not Wrapping Correctly on Mobile Safari/Chrome

[[email protected]]

Hello Porto Team, Just wanted to start by saying that our experience to date w/ Porto has been incredibly positive. The template is robust & innovative and your technical support is responsive and helpful.

We’re having an OWL Slider issue w/ the text animations on mobile Safari & Chrome, where the text wraps incorrectly (e.g. instead of moving the word “lifestyle” to the next line it will place “lifes” on one line and “tyle” on the next line).

This occurs on mobile Safari/Chrome in both Portrait and Landscape orientations.

The odd thing is that when text animation is turned off and all of the text is presented at once onscreen, the word wrapping is correct.

We’re able to replicate this problem both on smartphones natively (Chrome & Safari) and on desktop/laptop (Chrome & Safari) by shrinking the browser window.

Would appreciate your insights. Thanks.

---

[Support]

Hi, unfortunately the way that plugin works (split letters) works better in single line texts, because it separates each letter (and not each word) as one element.

So another way to do that would be changing to another effect, typeWriter for example:

<p class="text-4 text-color-light font-weight-light opacity-7 text-center mt-2 mb-4" data-plugin-animated-letters data-plugin-options="{'startDelay': 500, 'minWindowWidth': 0, 'animationName': 'typeWriter', 'animationSpeed': 50}">To Better Health provides medical nutrition therapy, dietary, and healthy lifestyle counseling to adults, seniors, couples, and families.</p>

More text animations available: https://www.okler.net/previews/porto/9.9.3/elements-animations.html

Hope that helps.

---

[[email protected]]

Thank you for the explanation. Makes sense. I switched to a different animation and the word-wrapping works perfectly on mobile now. Sincerely appreciate your rapid response! Closing ticket…

---

[Author]

Posts