Little bug Easy slider on Safari / Impact on font weight - Support

Viewing 27 posts - 1 through 27 (of 27 total)

Author

Posts
October 11, 2014 at 3:37 pm #334325

Marie
Participant

Hi,
I just noticed a little bug with the easy slider on SAFARI only.
The font weight is kind of changing at the same rhythm than slides…
I first noticed that on my site, but then I checked on Enfold demo and it’s doing the same thing : see on main demo -> Pages / About us. See how the text “Welcome to my agency…” is behaving ? Same for page title & breadcrumb.
It’s doing it also on my site (see private link > mini easy slider in the footer).
May be it’s my own safari browser that has a problem…? Can you check on your side ?
On chrome & Firefox there is no problem at all. And for IE I’m not able to check…
Thank you very much !

Kind regards,
Marie

October 13, 2014 at 11:02 am #334783
Ismael
Moderator
Hi Marie!

Thank you for using Enfold.

Please edit the text layers on the layer slider. Go to Styles > Custom CSS field. Add this:
```
font-weight: 400;
```
Apply it to all of the text layers that are using the Varela Round font.

Best regards,
Ismael
October 13, 2014 at 12:41 pm #334817

Marie
Participant

Hi Ismael,
I’m not talking about the layer slider. I’m talking about the EASY SLIDER. And the font problem concerns texts that are AROUND the easy slider (not on or in it). Texts move a little at the rhythm of the slides when the easy slider is active. You can check on the pages I told you in my previous message (the enfold one + the one of my site -> page “nos recherches”). For what concerns my own site, text is not getting a little bolder anymore since I have just added some “text-rendering” css and it solved it (but it was getting bolder before that though ALL my fonts are “400”). BUT the text still moves up a little up and down (on chrome too).
And on Enfold demo you will see what i mean (on SAFARI) if you go to “Pages / About” -> see the text at the right of the easy slider -> it gets bolder / normal / bolder / normal etc…
Sorry if I’m not “clear”, I’m trying to do my best with english… ;)

Best regards,
Marie

October 14, 2014 at 6:12 am #335366
Ismael
Moderator
Hey!

Oh right. Please try to add this on Quick CSS or custom.css:
```
.page-id-13 ul.avia-slideshow-inner {
max-height: 436px;
}
```
If possible, add a Separator/Whitespace element below the easy slider.

Cheers!
Ismael
October 14, 2014 at 9:09 am #335452

Marie
Participant

Hey Ismael,
Thank you. I’ll eventually try that when I’m fixed on the page “composition”. Project is only starting and I’m still waiting for definitive content. For info there is already a space/separator element below the slider on the “nos recherches” page. So I’m not sure it’s a matter of “height” (cf your code) for what concerns the easyslider. Moreover, depending on the browser (on mac for me), the impact of the slideshow can be on the whole page. it’s very “discrete” and I’m not really sure that you’ve noticed it, but if you pay really attention you will notice that some texts and-or images and-or section move up and down very slightly. But no more problem AS SOON AS the easyslider is not “playing” anymore.

Once again just to be clear enough :
1. For me the problem is that “slight elements MOVING problem” / Safari, Chrome, Firefox / cf. Page “nos recherches”
2. As for you, on the ENFOLD DEMO, the problem seems to be on Safari (mac) only and is more kind of a little “flashing” problem (texts seems to slightly change of weight on and on) ->>>> And this is for the WHOLE page, including footer etc… For info I also had this same “flashing problem” on my own site BEFORE adding text-rendering css.
http://kriesi.at/themes/enfold/pages/about-us/

Regards,
Marie

October 15, 2014 at 5:29 am #335922
Ismael
Moderator
Hi!

Thank you for the update.

Please try to add this on Quick CSS or custom.css:
```
.avia-slideshow-inner li{
-webkit-transform-style: preserve-3d; /*fixes flickering issue when slider moves. usually other elements in other container flicker */
}
```
Remove browser cache then reload the page. If it’s not enough, add this:
```
.avia_textblock,
.avia-icon-list,
.avia-button,
.avia-testimonial,
.iconbox,
.avia_message_box,
.avia-team-member,
.widget,
.post,
.team-img-container img,
.team-social,
.iconlist_icon,
.fallback-post-type-icon,
.fullsize .related_posts,		
.grid-image,				
.avia-caption-content, .avia-caption-title, 
.entry-content-wrapper,	
.avia_start_animation
{
	-webkit-perspective: 1000;
	-webkit-backface-visibility: hidden;
}
```
I hope that fix the issue.

Best regards,
Ismael
October 15, 2014 at 9:22 am #336012

Marie
Participant

Hey Ismael!
Thank you very much for your reply. Unfortunately the flickering issue is still there… on MAC at least.
I’ve left the code you gave me in my style.css if you want to check “live” its “non-impact”…
Any other idea to fix this issue ?
Thanks for your help.
Kind regards,
Marie

October 20, 2014 at 2:12 pm #338317

Yigit
Keymaster

Hi!

Sorry for the late reply!
Which version of Safari and OS X are you using? I just checked your page on Safari 8.0 on OS X 10.10 but i could not reproduce flickering issue

Regards,
Yigit

October 20, 2014 at 3:17 pm #338369

Marie
Participant

Hi Yigit!

Actually my flickering issue is both on safari, chrome and firefox if you read message from october 14 :

For me the problem is that “slight elements MOVING problem” / Safari, Chrome, Firefox / cf. Page “nos recherches”

I’m using Mac OS 10.6.8 (I’m not upgrading voluntarily for some software reasons)
Safari 6.2 + Chrome 38.0.2125.104 + Firefox 33.0

Thanks Yigit!! Really hope this can be fixed…
Best regards,
Marie

October 20, 2014 at 3:22 pm #338372
Yigit
Keymaster
Hi!

I checked in Firefox, Safari and Chrome, all latest versions but i could not reproduce the issue. I will ask @andy to take a look at your page on his Mac. Please kindly wait to hear from him.
EDIT: in the meantime, please try checking your website on another computer and see if you can reproduce flickering issue

Best regards,
Yigit
- This reply was modified 10 years, 1 month ago by Yigit.
October 20, 2014 at 3:46 pm #338402

Andy
Inactive Moderator

Hi!

I am using mac OSX 10.9 and Safari 7.0 and everything looks perfect. Did you try to have a look on another computer?

Cheers!
Andy

October 20, 2014 at 4:47 pm #338449

Marie
Participant

Hi!
Thanks to both of you for the feedback. I’ve just asked a friend to check on her mac and she noted the same issue. Not that I don’t want to trust you ! ;)) but let me insist : The up&down movement is VERY discrete I must admit (but I’m kind of maniac girl and once you’ve noticed it you can’t ignore it anymore and it’s annoying!!). Once again the problem for me comes from the EASYSLIDER for sure. As soon as the “sliding” is not active anymore -> no more problem. And this happens for both Safari, Chrome, Firefox. Please really focus on the first paragraph under the slider (while it’s playing). If you see something at last, then you will notice the same problem for other elements below (the green changing color area, the footer…). Forgive me for insisting this way… hope you don’t think I’m crazy guys!! I’m just very “punctilious” and I like to “understand”… Waiting to hear from you…
Thanks again.
Regards,
Marie

October 20, 2014 at 5:26 pm #338483
Yigit
Keymaster
Hi!

The thing is we cannot provide you a proper solution as long as we cannot reproduce the issue. I will ask Josue to take a look, if he cannot reproduce it as well, unfortunately there is not much we can do :/
In the meantime, please try adding following code to Quick CSS and check if that makes any difference on all three browsers
```
body #wrap_all { transform: translateZ(0); }
```
Best regards,
Yigit
October 20, 2014 at 5:32 pm #338489

Andy
Inactive Moderator

Hi!

Do you mind giving us temporarily admin access? maybe it helps if we have a look at the items in your slider

Regards,
Andy

October 20, 2014 at 6:22 pm #338526

Marie
Participant

Hi!

@Yigit ! Still not fixed but there is a small improvement! So may be there is hope ;)
Now in SAFARI the text moves just once and then stays fixed. But the green section and the footer keep moving.
For CHROME & FIREFOX no changes from what I see (I refreshed and emptied cash).

@Andy : Thank you very much Andy I appreciate. I can send you my admin access if you give me your mail? Let me know if this is enough for you (I’m thinking of my child css file? will you be able to check it if needed?)

October 20, 2014 at 6:23 pm #338527

Marie
Participant

Oops I forgot the “thank you”!

Regards,
Marie

October 20, 2014 at 11:53 pm #338758

Andy
Inactive Moderator

Hi!

post the admin access here as a private reply. Only the support team will be able to see it.

Regards,
Andy

October 20, 2014 at 11:56 pm #338760

Yigit
Keymaster

Hi!

You can use (Email address hidden if logged out) for e-mail but as Andy said, please post login credentials here privately so any available moderator can look into it

Best regards,
Yigit

October 21, 2014 at 8:30 am #338872

Marie
Participant

This reply has been marked as private.

October 21, 2014 at 5:49 pm #339150

Marie
Participant

This reply has been marked as private.

October 27, 2014 at 5:04 pm #341595

Marie
Participant

This reply has been marked as private.

October 28, 2014 at 3:23 am #341946
Josue
Inactive Moderator
Hey Marie!

Seems to be caused by this code in your child style.css:
```
body #wrap_all { transform: translateZ(0); }
```
Cheers!
Josue
October 28, 2014 at 9:28 am #342088

Marie
Participant

This reply has been marked as private.

October 31, 2014 at 5:59 am #343871
Ismael
Moderator
Hey!

Sorry for the delay and thank you for the info.

I can actually reproduce the “jump” issue on Chrome. This fix seems to work. Please add this on Quick CSS:
```
ul.avia-slideshow-inner {
height: 462px !important;
}
```
Cheers!
Ismael
October 31, 2014 at 8:32 am #343901

Marie
Participant

Thanks Ismael!!!
My god all those messages though you were so close from the solution since the beginning… :/
Anyway happy that it’s fixed at last, and also that someone from team support has been able at last to “reproduce” my jump issue! I was feeling quite alone… :)
Before closing this looong thread, could you please just confirm me that I should better create a custom class for THIS slider. Just in case I decide to use again an easy slider somewhere but may be with different dimensions ( > which would then need a custom css with another height)? Right?

Thank you again to everyone.
Cheers!
Marie

October 31, 2014 at 4:16 pm #344085

Yigit
Keymaster

Hey!

You can turn on custom CSS field for ALB elements if you would like to give any of the elements on ALB a custom class to target using custom CSS code – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Regards,
Yigit

October 31, 2014 at 5:02 pm #344149

Marie
Participant

OK thanks !!
Regards,
Marie
Author

Posts

Viewing 27 posts - 1 through 27 (of 27 total)

The topic ‘Little bug Easy slider on Safari / Impact on font weight’ is closed to new replies.