Tagged: font rendering, safari
-
AuthorPosts
-
April 18, 2016 at 5:01 pm #616671
Hello,
SAFARI—For some reason, text on top of images pulse/jump when the entire masonry element is rolled over. Hover states seem off; multiple names/text are impacted by hover states.
I’ve found this thread on anti-aliasing, but none of the solutions seem to work for me.
http://stackoverflow.com/questions/9733011/safari-changing-font-weights-when-unrelated-animations-are-runningAny suggestions?
Thanks in advance.
April 18, 2016 at 5:14 pm #616679Hey kristenangel!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
.avia-safari .av-inner-masonry-content { -webkit-transform: translate3d(0, 0, 0); -webkit-font-smoothing: subpixel-antialiased; }
Best regards,
YigitApril 18, 2016 at 5:32 pm #616699Wow – such a quick response! Thanks so much. Works perfectly now.
April 20, 2016 at 8:51 am #618069November 22, 2016 at 5:50 pm #715468This worked for me as well. Thanks!
- This reply was modified 8 years, 1 month ago by Tflores87.
November 22, 2016 at 6:04 pm #715477That being said, my images look VERY blurry whenever the user Hovers over the image only on Safari (looks fine on Chrome and Firefox). Thoughts?
November 23, 2016 at 6:49 am #715737Hi @Tflores87,
Could you post a link to the site in question so that we can take a closer look please?
Best regards,
RikardNovember 23, 2016 at 7:00 am #715742Hi, Rikard,
Thank you for following up! You can find this behavior (most easily seen and most importantly) on my Shop Page (https://kingsdesigns.com/shop/). That being said, you can see it on my Portfolio Page as well (not as easily seen) (https://kingsdesigns.com/gallery/landscape/). This happens on Safari (as far as I have seen).
November 23, 2016 at 4:15 pm #716024Hi,
I checked your pages on my macbook pro retina and images show up pretty sharp on my end – http://i.imgur.com/b4LBk5N.jpg
Please flush browser cache and refresh your page a few times – http://wiki.scratch.mit.edu/wiki/Hard_Refresh
Which version of Safari are you using? Also, can you please post a screenshot and show how it looks on your end?Best regards,
YigitNovember 23, 2016 at 6:22 pm #716094Thanks for the response, I/we greatly appreciate it!!
The images do look fairly sharp, it’s when the user hovers over the image that they get very blurry. I will post a video since the quality of the screenshot may not be as apparent. In fact, after reviewing the videos, they are still blurry on HOVER, but the video quality altogether doesn’t look great. Here is the video I created (https://kingsdesigns.com/wp-content/uploads/2016/11/BLurry-Hover.mov). Here is another video on another Mac + Safari (https://kingsdesigns.com/wp-content/uploads/2016/11/Blurry-Images-From-another-Mac-Safari.mov)
I am using Safari Version 10.0.1 and tried reseting Safari a few times, but the problem persists.
- This reply was modified 8 years, 1 month ago by Tflores87.
November 23, 2016 at 6:45 pm #716110Tflores87,
I think the fuzziness issue is related to the thumbnail image size that is getting pulled in your gallery grid/element. Try changing the size of the Thumbnail that gets pulled and see if that helps.November 23, 2016 at 7:23 pm #716127Thank you, Kristenangel, I will check! I wonder why it only happens for Safari, though.
December 15, 2016 at 1:21 am #724705Hi Yigit, I wanted to check with you and see if you had any luck? The image hovers are still blurry for Safari users.
December 19, 2016 at 6:24 am #725952 -
AuthorPosts
- You must be logged in to reply to this topic.