Shrink stopped working properly

Hi, I have a shrink effext in the header of my website www.farbratten-zucht.de.

It is supposed to look like this:

and then shrink to this on scroll

It all worked fine for some time, but now suddenly the shrink effect seems to get stuck in google chrome. Sometimes it shrinks, sometimes it doesn´t, sometimes it shrinks after a while…it looks like this

What really puzzles me s that is suddenly stopped working after doing fine for a long time. I didn´t chance anything on the site. I already deactivated all plugins to see if it is a plugin conflict, but it isn´t.

Hello @kathringuttmann,

Thank you for the very detailed post information. I have checked your site and your header is working fine on my end.

I did notice that you have installed a caching or minimizing plugin. Please clear all your plugin caches and then test you site again.

Hi, I have cleared all caches, deactivated all plugins and tested on 3 computers: it does shrink sometimes, but most often it doesn´t…it works in Edge, it does not work in Chrome. I have even deinstalled and reinstalled chrome.

Sometimes is works in the beginning and gets stuck when you scroll a couple of times

Hello @kathringuttmann,

Please disable all your caching/minimizing plugins and test your site again. You may need to clear your browser cache first or use private browsing mode and test the site.

Hope this helps. Kindly let us know.

I did that…I deactivated all plugins and nothing changes…sometimes it works, sometimes ist doesn´t

I tried to replicate it with a new header and I get the same effect - the shrink doesn´t work in Chrome all the time. Even the preview in the header builder does not show any shrink

Hello @kathringuttmann,

I have tried over and over on my end using Chrome. I even tested the site using Incognito mode. I still could not replicate the issue.

Please try using Incognito mode or private browsing and see if you still have the same result?

Kindly let us know how it goes.

I have the same result using incognito mode on 3 different PCs…

Hi @kathringuttmann,

Thanks for reaching out.

I checked sometimes it works and sometimes don’t. Then opening the browser inspector and toggling off and on the flex styling, it makes it works again. Which is a bit weird since the styling is just the same, just turned offf and on.

Would you mind providing your admin login credentials as well so we could directly check the flex setup in the admin?

Thanks!

Hii, I wrote you a secure note with the login credentials…I am using cloudflare since today (problem occured much earlier), so if you make any changes you would have to purge the datanbase. I will set cloudflare to developer mode

Hi @kathringuttmann,

Could you try it again? Disabling autoptimize plugin made it works, clearing cache isn’t enough as I’m not sure if it’s really cleared.

Thanks!

No, doesn´t work. By the way I only installed the autoptomize Plugin after the problem occured for the first time

Hi @kathringuttmann,

Yes, it’s quite weird, now it’s not working again even with that plugin inactive. The issue is that its height stays on 240px even though the javascript already setting it to 120px (half of its size). I’ll continue checking, it’s my first time seeing this kind of issue, removing the image fixes it but then the issue goes back later.

Is it okay if I disable everything? If not, I recommend creating a staging copy of your test so I could test it there without harming your live site. Please check this for staging https://theme.co/apex/forum/t/slider-revolution-error-message/48874

Thanks!

You can disable everything…but it doesn´t help, I have tried that 3 times…but please make sure that you enable all the plugins that are enabled now and leave the ones that are not enabled now unabled.

Could it be that I have used a javascript compression tool that broke something in the theme? might deinstalling and reinstalling the theme help? And if I did that - would all my headers, footers and site be lost? Or can that be done?

Hey @kathringuttmann,

When you said:

Did you mean you edited the theme directly? In that case, yes, reinstalling might help. It won’t affect your headers, footers or content since they’re stored in the database.

If you can rebuild your header, that is an option too. I’ve tested duplicating your header and the issue persists in the copy so the original might have been corrupted. currently by an unknown reason.

I wiped out everything in the duplicated bar (Copy of Version4.0 Frontpage) and added a new shrinking bar and a scaling image and it works fine.

Thanks.

Well, I can tell there is something different, but the Logo doesn´t shrink. The bar shrinks fine now, but not the Logo…no, I didn´t change anything in the Theme itself. And have already tried rebuilding, too - with the same result. The Logo still doesn´t shrink

Ah OK, in the other one it does work
so now I have to rebuild everything?

OK, I started rebuilding everything in the copy but it stopped working again…when I enteres the background image and set it to contain top…I tried to delete it again but it doesn´t work anymore

I have replicated it…when I add the background image to the bar and set X Axis, contain, Top it breaks…but the entire thing only makes sense with the backgrpund image. The weird thing is that the background does shrink, but not the logo, If I delete again, it stil doesn´t work

Weird things are happening, too…I tried to put the logo on standard and back on scaling, but then the bar doesn´t shrink to 50% as it is supposed to, but to someting like 5%

Hi @kathringuttmann,

I created a sample page with sample header with shrink option and a logo. I had to disable the Autoptimize and Cloudflare plugin since it’s not working, and my created sample. Could you try re-creating it without those plugins, and please don’t activate it while you’re still testing.

The test page http://www.farbratten-zucht.de/x-test-shrink/

Any optimization and caching shouldn’t be active during development or testing, since it’s the opposite of change.

Thanks!

it stops working when I add the background picture…like I wrote above…it doesn´t have to do with those plugins…by the way: the shrink stopped working long before I used cloudflare and autoptimize

It stops working as soon as I add the background image to the bar and set it to x-axis, contain, top…As I wrote before…

I wonder if you have even read what I wrote…

Hi @kathringuttmann,

I did change the background image too and my recommendation about disabling Cloudflare and Autoptimize is just to make sure it won’t hinder our testing. I’m not saying it will always fix it, for example, the entire thing isn’t usable on my end so I have to disable it, and I’m only recommending to stay it that way while we’re testing.

I did check the background and it works too and that sample page that I created is just new, so I can show you that it works on a very simple setup. So then this is the video recording for that test page with your added background https://www.dropbox.com/s/4iv9j2366h2bk38/bandicam%202019-05-08%2008-14-10-811.mp4?dl=0

May I know which google chrome version has this issue? And have you tried it with Firefox too?

Thanks!