Pete Barr last won the day on
Pete Barr had the most liked content!
Pete Barr
Business-
Posts
144 -
Joined
-
Last visited
-
Days Won
1
Pete Barr last won the day on
Pete Barr had the most liked content!
About Pete Barr
Contact Methods
- Personal Website
Recent Profile Visitors
2,380 profile views
Pete Barr's Achievements
- Rare
Recent Badges
179
Reputation
-
Pete Barr changed their profile photo
-
Ahhhhh! That really rings a bell now, doh! Thanks so much Shaun and Jack!!
-
Showing my severe lack of coding skills here I thought as it's just a string it would just evaluate with the index appended. I'm a little confused by vars[myWeight]=900 rather than say vars.myweight = 900 to add it to the object. Again, sorry, but mucho appreciate the help.
-
@Visual-Q Yip, setting and resetting the images to display none when the hero is animating paved over my stagger jitter issue. It's always the simple answer you overlook, doh! It's still strange the issue anyway but at least this removed the jitter. Cheers to everyone, mucho mucho appreciated!!! Hopefully, this is worth all the effort with only a couple of weeks left to build the site. I'll post the link here when I've finished. Pressure is on!! Ta!!
-
@Visual-Q Yeah the animation on the images works fine, it's just a simple scale tween. The images are in the viewport under hero header and are initially 'visible' but when the user scrolls down the header animates out and the images are displayed in sequence on scroll, so they are display: none when not 'in view'. I'm using fullpage.js to achieve this by extending upon its capabilities. I can set them all to display non initially which might help, I'll give that a try. I can't defer loading them as that would break the experience. @OSUblake Yeah using a retina display, does that have a bearing even though the issue is only present in Chrome? I checked out the FPS meter and there were no spikes in GPU, just a bit in the FPS as there is a few things animating at the same time. I know it's frustrating I can't show you the issue in reality since it's related to a rebrand, really sorry guys but I really appreciate all these suggestions as always.
-
I narrowed the problem down to 3 images further down the page that are not related to the animation in question, and never referred to. These images are animated later when another function is called after an interaction is done. If I delete these images the logo stagger animation is fine and that issue in devtools is cleared. The images are using object-fit:cover and are larger than its container in most responsive circumstances. If I use one from placeholder.com, a small one, the logo animation is again fine. A large one and it's slightly janky but not to the same degree. If I delete all js animations bar the logo animation with the stagger, and keep the images (as in below), the jitter remains with the issue in devtools. I have no idea what's going on <img class="islide__img" src="<?php echo get_template_directory_uri(); ?>/assets/src/images/temp/bolt.png" alt="">