-
Posts
-
Ever since the last Enfold update I’ve been seeing an aggravating, intermittent problem with a parallax color section.
The background image sometimes (but not always) appears shifted far below where it’s supposed to be. So most of the color section is dark grey, with the top of my image peeking out at the bottom of the section.
At some point it rights itself, and looks fine thereafter.
Since I use Chrome often, that’s where I see it. I haven’t seen it in Firefox or Safari, but since it’s intermittent and since I don’t use those browsers much, i can’t say for sure that the problem is Chrome-specific.
The problem appears on this page: http://kenblackman.com. The empty color section in the middle of the page.
I can provide a screenshot of the problem if that would help; LMK the best way to do.
Thank you for any help that you can provide.
Hey mantisjitsu!
Is there any easy way to reproduce the issue? I reloaded the page around 30 times, clear the cache, etc. but I’m not able to reproduce the issue with Chrome on Win8 at all. I didn’t try Firefox or other browsers though. Maybe a browser extension breaks the website?
Cheers!
PeterHey!
@reederjack5252: I can’t see the issue on Chrome. Can you please provide a screenshot?Cheers!
IsmaelHere’s a link to a screenshot: http://i.imgur.com/WKTdTOA.png
As you can see the top of the parallax portion is cut off. It should be directly under the banner at the top. (And sometime it is, but not all the time.)
Any chance you’ll be adding pics to this forum? (The only reason I have an Imgur account is for Enfold theme support.) Kind regards.
Hi!
Thank you for the info.
On what specific browser does this issues usually occur? I checked the site on Chrome and Firefox a few times but I can’t reproduce the issue as described on the screenshot. I don’t think there will ever be an upload feature on the forum. It will consume a lot of the domain space and will considerably slow down the site. I personally don’t use an imgur account, you can just upload any image you want then get the imgur image url.
Regards,
IsmaelHi!
Alright. I can see the issue on Windows 8, Chrome and Safari. It is random as reported but we can’t reproduce the issue on on our installation. Please download the latest version 3.0.2 from your themeforest account then update the theme via FTP. Please refer to this link for more info: http://kriesi.at/documentation/enfold/updating-your-theme-files/
Regards,
IsmaelHi. Thanks to everyone who’s looking into this. OK I updated to the latest Enfold yesterday and cleared browser and server caches. Today I’m seeing the problem.
My website: http://kenblackman.com/
Screenshots of the problem:
Thanks for any help you can provide! As you can imagine from seeing the pics, when it happens it’s, um, not good.
Hi!
@mantisjitsu: I can’t reproduce the issue on your site but it is intermittent on @reederjack’s site. Looks like you’re not using a cache plugin. Please try to install W3 Total Cache or WP Super Cache.Cheers!
IsmaelI ‘ve been using WP Super Cache the entire time this issue has been occurring. Any ideas? What settings would prevent this from occurring? Thanks.
@reederjack5252, to me it looks like a browser rendering quirk that Enfold is somehow poking. The bug is particularly aggravating b/c it’s intermittent—I can neither deliberately cause it nor prevent it. (And I’m a software QA veteran.)
That said, it seems like once the page rights itself, the problem doesn’t return, until the next “first” load. For reproducing it, I would suggest (a) clearing browser cache and reloading, and (b) trying different window sizes. But it’s just an educated guess.
As mentioned above, I’m using Chrome on OSX, everything up-to-date.
Hi!
Thank you for the update.
Caching might speed up script loading and might prevent the issue, just a guess. But since you already have one, I guess that solution is rendered moot. I’m not familiar how SuperCacher works, is there some kind of script compression or minifying settings? I would like to check the dashboard but the login credentials are incorrect. Please check. I’ll ask Kriesi to take a look.
Cheers!
IsmaelHi!
I’m sorry but the login credentials from this post is really not working: https://kriesi.at/support/topic/intermittent-problem-with-parallax-color-section-since-last-enfold-update/#post-346623
I’ll ask the rest of the support team to check the thread.
Cheers!
IsmaelHi!
I checked your website with Chrome and Safari 7 on Mac OSX 10.9.5 and everything looks beautiful. Could you fix it?
Regards,
AndyHi Andy, yea the bug is intermittent. Right now it looks great in my browser as well; other time, it’s messed up as shown above. Without making any changes to the site.
Hi!
It looks good on my end too, to be honest it is really hard for us to debug an inconsistent problem, please check it on another computer/network/browser to discard.
Cheers!
JosueHi,
My original problem has not been resolved and it’s happening on another site I’m developing: http://rx4edu.com. I understand that this is an intermittent issue, but more often than not it happens upon load, and given that this is happening on numerous sites this has to be an issue with the theme.
I’ve noticed that as soon as you resize the window the parallax feature corrects itself. Please let me know what I can do to take care of this. Thanks!
Hi,
Try adding this at the very end of your theme / child theme functions.php file:
function add_custom_script(){ ?> <script> (function($){ $(window).load(function() { $(this).trigger('resize'); }); })(jQuery); </script> <?php } add_action('wp_footer', 'add_custom_script');Regards,
JosueHey Guys!
I have added a small fix to the parallax script that I think might solve the issue with the next update. Since I cannot be sure please let me know if the error persists after updating to 3.05
Also in that case it would be great if you can post me your ftp credentials so I can do some trial/error testing with the javascript files.
Although this does not really seem to happen to a lot of people I really would like to get this solved for the two of you. Lets hope the bugfix does it ;DBest regards,
KriesiKriesi,
It has happened to me every time I have used the parallax effect. It is intermittent as described in this thread. I have identical problems and I tend to do development in Firefox and have about 3 versions of Firefox on three separate boxes ranging from notebooks to 42 inch monitors. The problem occurs in all of them. It is not a browser version issue in Firefox because I’ve got ’em young to old. I quit using Parallax and just use a Fixed position color background instead which gives a similar effect.My hunch is your issue is the complicated Enfold CSS which is mostly inside your brain and not in mine because you authored it. So, I haven’t dived in to try and fix it. Your CSS is complicated and I’m a guy that knows CSS pretty well. I think the problem occurs by using a combination of various Enfold elements above and below a parallax element, but I can’t put my finger on which combination it is from memory. It appears to me that the CSS doesn’t keep up with the Javascript, but that’s merely a guess based on what I see happen on screen. The hiccup happens quick. Only a flash for a split second where the background peeks through. I have tried matching the underlaying root level bg colors and everything in between all the way up to the parallax element, but that didn’t really mitigate the problem. It still is chunky performance. If it is any help, it happened a lot more often to me using Firefox (Windows OS) than what mantisjitsu describes. Mine was pretty darn consistent. Enough to be too annoying to use in a live site because even the basic web surfer would be wondering what’s going on.
I can’t send you links because I long ago tabled using the effect. FYI, parallax also has problems in mobile devices that use Android. I don’t own an Iphone, so I can’t give you input there. I think the Android issue is a known issue. The parallax element jumps to the top Z-index layer and blocks all underlying content below on an Android mobile phone. So, the the page is worthless on an Android phone because you can’t see anything underneath and just briefly see snippets of the page as you swipe downward, but the parallax element jumps right back over the page. I basically quit using wither Fixed Position or Parallax BG’s on a color background container on mobile devices with your theme. They are set as display:none; with media queries on everything below tablet width.
And finally, I have used Parallax effects that were coded in very basic web pages without a complicated code structure like Enfold and never got a hiccup in Firefox.
Cheers and good luck.
DonHey!
I actually don’t think thats a css issue at all. As far as I can tell the javascript sometimes does not calculate the height of the underlying element correctly which causes the problem. Thats why when the browser is resized and the javascript is fired again everything is aligned properly. So basically a problem with the first javascript calculation.
Whats also weird is that this does not happen to the majority of our users. But as I said, I will keep investigating the issue until its fixed :)
Cheers!
KriesiKreisi,
The bug still exists. Just upgraded WordPress and also your latest version 3.0.5 with a test site I built a couple of months back.
It has the same exact behavior. Could be a cache issue after updating, but I’m doubting that. Cleared it out, but you never really know and I don’t really have any more time to invest in this issue. I would very much like to use the parallax effect, but it’s been an ongoing issue ever since you launched it. It has always flashed. FYI, we bought your template when sales hovered around 5K.I will tell you that the flashing of the pages in your template acts just like I described above and has not changed after your update. Not one iota. The behavior exhibits all the traits of a CSS issue that is trying to catch-up with your script. Or, vice versa. Since you’re relatively confident in your previous post that you have the dynamic Javascript tightened-up, I will steer you to this CSS code snippet below. It appears to be trying to assist with the dynamic rendering of the parallax, and to me (an outsider), this might be prone to timing issues when trying to get the drum beat and bass synced up in the song. One might lag behind the other in certain browsers as it scrolls.
.avia_desktop.js_active .av-parallax{opacity: 0;} .avia_desktop.js_active .active-parallax{opacity: 1;}The troublesome behavior looks just like what this code does. The underlaying BG color flashes white first and then flicks on when the opacity of the top image catches up a split second later.
I am fairly decent at finding bugs and their causes, but mostly when I control all the code. It takes patience and thorough knowledge of the underlying code base to debug issues. In your case, I know nothing about your Javascript that controls the parallax code. All I can offer is my opinion based on what I see on the screen and what I’ve experienced from coding websites. And the troublesome behavior reflects CSS trying to catch-up with dynamic content: Ie: the foreground element moving over the white background color giving a flash bulb effect to the white BG as the element first begins to move and starts shifting to an opacity value of 1. In our case, the parallax element holds an
<img>that is relatively large 1200px (+), so it could easily flash as the image dumps into view in the browser.If I am misunderstanding how all this stuff dances, my apologies.
I didn’t write the song.
Just merely giving you input.Good luck.
DonEDIT ADDED: P.S. One other thing I will tell you is that I’m tethered to the internet via wireless. 4G connection, with an average of 1-2mbs, sometimes faster off peak times at 4-6mbs. Because the parallax element is requesting an image that is large, perhaps for some strange reason this affects things? I don’t really know. One would think that it is cached in the browser once the image and site is fully loaded, but I thought I would throw this bit of technical info out there. Plus, 1-2mbs should have no problem keeping up once the site is fully loaded, even if for some odd reason your script was sending a separate parallax image request a second time (i highly doubt that’s the case). It’s probably a rabbit hole that has no merit exploring, but I wanted to share this info. Again, I didn’t write the song.
Hm, at this point I think the only possible solution, since neither me nor anyone in the team can reproduce this issue, is to get access to an installation that has the problem.
If anyone wants me to investigate the issue further, has a testserver with the issue active and is willing to let me do a few tests please share the following data in a private reply:
– Your wordpress credentials so I can check the settings
– FTP credentials so I can do a few try/error tests and log some javascript information that should help debugging the issueCheers!
Hi Guys, I’ve been having the same intermittent parallax issue with a site I’m working on using the latest versions of both WordPress and Enfold. I’ve been getting the issue in my Safari browser on Mac, but I tried viewing the same page in the latest version of Firefox and it displays perfectly! Looks like a browser incompatibility issue to me.
Just my two cents! Hope this helps.
- The topic ‘intermittent problem with parallax color section since last Enfold update’ is closed to new replies.