Forum Replies Created
-
Posts
-
fn.avia_sc_animation_delayed which applies .avia_start_delayed_animation seems to cause the issue. Using Google I could find a lot of issues with setTimeout in Chrome.
The issue must be caused by a combination of css classes. I have made some tests.
Isolated (on a simple single test page outside of wordpress) the following css works well on the affected chrome browsers:
.avia_transform .avia_start_delayed_animation.av_font_icon{ -webkit-animation: avia_appear 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275); /* Safari 4+ */ opacity: 1; -moz-transform:scale(1); }Removing the duration or setting the y2 value to 1 or less solves the issue in Enfold:
.avia_transform .avia_start_delayed_animation.av_font_icon{ -webkit-animation: avia_appear 1 cubic-bezier(0.175, 0.885, 0.320, 1.275); /* Safari 4+ */ opacity: 1; -moz-transform:scale(1); }or
.avia_transform .avia_start_delayed_animation.av_font_icon{ -webkit-animation: avia_appear 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1); /* Safari 4+ */ opacity: 1; -moz-transform:scale(1); }I guess it is something with .avia_animate_when_visible or .avia_start_delayed_animation.
Regards
Michael
I have converted the video to mov format. Please try again at http://mensmaximus.re/video.zip
No it is not solved. As I already told you the effect shown in the video does not happen with every Chrome installation (newest Version each). I have even reinstalled Chrome to no avail.
Removing the -webkit-animation-duration from .avia_transform .avia_start_delayed_animation.av_font_icon solves the issue on the affected PC.
The question is on how many Chrome installations it happens and what causes the issue on this installations. I have tested it on 4 computers (1 PC with Win7, 1 Notebook with Win7, 1 VM with W2k8R2, 1 VM with W2k12). Two show the issue (PC and 1 VM), two dont (Notebook and other VM). Alle machines have the same Chrome version without any extensions.
It is clear this is not an Enfold only issue. However as it can be resolved with changing the css it must be “half” related to it.
Regards
Michael
Update: I found this on the web https://github.com/twbs/bootstrap/issues/10564
The issue might be related to bootstrap.
I just fiddled around with this issue an it starts to get even more wired. It is a css issue with
.avia_transform .avia_start_delayed_animation.av_font_icon{ -webkit-animation: avia_appear 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275); /* Safari 4+ */ }If I remove the duration (0.7s) than it works in Chrome as expected and like seen in FF, IE, Safari and Opera. However the effect does not show up on each Chrome installation. I have compared two computers botch running Windows 7 Pro with latest updates and Chrome Version 32.0.1700.107 m. One is a i7 with a Geforec GTX 670 and 3 monitors. The other computer is a notebook with i3 and Geforce GT 640m. The laptop does not show the wired “flicker” in the animation.
Regards
Michael
First of all I have to say Enfold is the best theme I ever worked with. You do an awesome job!
While working with the theme I came over two issues causing me some headaches and a serious amount of time to solve. I think this issues can arise for a lot of customers and a future update should take this into account.
1. The form builder included in Enfold is great for some smaller contact or feedback forms. However if you need advanced features like file upload or special field conditions you need to use 3rd party plugins as recommended by the Kriesi Team. I tried a few but was not satisfied with the output. The main issue is the CSS declaration for any kind of form fields in Enfolds base.css. Finally i had to use a child theme, use a modified base.css which has to be loaded from a modified function.php. While this is possible it might be to difficult for many users. My suggestion: move the CSS definition for forms into a separate css file and introduce a checkbox in the theme options to disable loading of this css styles.
2. The team member element included with Enfold is nice but due to the fact it is only page oriented (versus a custom post type available globally) forced me to use a 3rd party solution. All the plugins I tested have one thing in common: they makes use of single page settings (single vs. page). Because Enfold does not have global settings for single.php any plugin using it will display the site with header (breadcrumbs, title) and sidebar. If you dont want that you have to write your own single-xxx.php file and put it into a child theme. This might be to complicated for most users as you have to even write your own loop code depending what design you want. And getting the right CSS classes gives you a hard time. My suggestion: Introduce a single setting (for individual posts) that differ from the ‘single blog post’ settings. There are many plugins out there which use the single-xxx.php to display content.
Keep on the fantastic work!
Regards
Michael
Hi,
thank you for your reply. The debug mode works well with the child-theme.
I already played with that idea before but after setting up a child theme i had to realize it does not save my changes to a style. E.g. i change the background color of style ‘orange’ and save it. Reloading the website reflects the changes as expected. Now i test an other style but after all i go back to ‘orange’. As soon as i click on the ‘orange’ style my custom background is gone.
It would be helpful to have ‘real’ custom styles.
Regards
Michael
Hi,
the site is under development and not publicly accessible at the moment. Thanks for your offer and your answer.
Regards
Michael
