This topic has 7 replies, 3 voices, and was last updated 7 years by 
-
-
Hello,
I’ve noticed that custom headings still have animation on it even when the option “Disable on mobile devices only” or “Disable on all devices” are checked. It’s an issue on one page designs on mobile, because my headings takes a lot of time to appear on some devices. For now I double the heading, one with animation with visibility on computer and one with no animation with visibility on mobile devices. It works but I’m not sure about the quality of this kind of thing regarding SEO.
Hello, will assign the ticket to a higher support level who can help and advise you in your query.
Thanks! ?Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionLaura Solanes - Graphic Designer and Web Designer
Please be patient as I try to answer each topic as fast as i can.
If you like the theme or the support you've received please consider leaving us a review on Themeforest!
Always happy to help you 🙂
Hi,
Add this css in quick css area
COPY CODE.animated,.wpb_animate_when_almost_visible { /*CSS transitions*/ -o-transition-property: none !important; -moz-transition-property: none !important; -ms-transition-property: none !important; -webkit-transition-property: none !important; transition-property: none !important; /*CSS transforms*/ -o-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; -webkit-transform: none !important; transform: none !important; /*CSS animations*/ -webkit-animation: none !important; -moz-animation: none !important; -o-animation: none !important; -ms-animation: none !important; animation: none !important; opacity: 1 !important; filter:none !important; }IF you want to turn off only on mobile devices use the next css
COPY CODE* Small Devices, Tablets */ @media only screen and (max-width : 768px) { .animated,.wpb_animate_when_almost_visible { /*CSS transitions*/ -o-transition-property: none !important; -moz-transition-property: none !important; -ms-transition-property: none !important; -webkit-transition-property: none !important; transition-property: none !important; /*CSS transforms*/ -o-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; -webkit-transform: none !important; transform: none !important; /*CSS animations*/ -webkit-animation: none !important; -moz-animation: none !important; -o-animation: none !important; -ms-animation: none !important; animation: none !important; opacity: 1 !important; filter:none !important; } }The CSS will be added to wp-admin -> theme options -> general settings -> quick css
Cheers
R.Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionWow, that was quick, thanks a lot. Tested and works well now.
I found this bug on custom titles, but maybe there’s other elements that have the same bug. Does the css fixes all kind of situations ?
Will that be corrected on the next update of the theme maybe ?
Have a good day and thanks for your time.Hi,
I’ve targeted also the class ‘wpb_animate_when_almost_visible’ which thru this class some animations are applied and that it’s added by the visual composer for all their elements that have set animation for animate when almost visible.
The css rule should fix that!
Let me know if you notice a problem on any element
Cheers
R.Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionOk thanks for the precisions. Is it planed to be part of an update of the theme, or will I need to do this hack everytime ?
You will have to add the css on every install, but if you will use kleo child and you will paste the css to wp-content/themes/kleo-child/style.css will be keep even if you update the theme.
Cheers
R.Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution
The forum ‘Bugs & Issues’ is closed to new topics and replies.
