Image scale in on hover issue

9 replies · opened Jul 11, 2020

Ooskar321Jul 11, 2020

Hi,
since I'm using lazy loading images, the smooth scale in on images isn't smooth anymore. Any advice to have it working normal again?

Second questions is about your last update. I changed the functions.js file in my installation (6.02), because of the goto top issue. Are there more files I should update anyway?
I'm using the restaurant template.

Thanks and regards
Oskar

Ooskar321Jul 13, 2020

Hi friends,
did I faced a big issue?
Best regards :)

SSemicolon WebSTAFFJul 13, 2020

Hello,

Thanks for reporting this. Unfortunately, this might not work as expected, as both of Lazy-Loading and Image Scale uses CSS Transitions. You can consider replacing the existing code with the following:


.imagescale img:not(.initial),
.imagescalein img:not(.initial) {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
}

.imagescale:hover img:not(.initial) {
	-webkit-transform: scale(1);
	transform: scale(1);
}

.imagescalein img:not(.initial) {
	-webkit-transform: scale(1);
	transform: scale(1);
}

.imagescalein:hover img:not(.initial) {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

For the Swiper Slider, you will need to follow the same instructions but inside the js/plugins.swiper.js File.

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Ooskar321Jul 14, 2020

Hi,
I just included the code for image scale-in and offline on my pc it worked like a charm but on my web server it's not working. I don't know why. The code is included inline and should work.

Any suggestion?

Thanks and regards
Oskar

SSemicolon WebSTAFFJul 14, 2020

Hello,

There is no reason why this should not work online. This might be an issue with Browser Cache. Simple clear your Browser Cache and check this again. Else, please provide us with a Live URL so that we can check out the exact issue and provide you with more assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

SSemicolon WebSTAFFJul 16, 2020

Hello,

We have tried checking your Website and there is no reference to the New Codes we have provided. Can you please provide us with the name of the File where you have added the New Codes, so that we can check out the exact issue and provide you with more assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Ooskar321Jul 17, 2020

Hi there,
I had the code first inline in my index file then I moved it to custom css file. It's still there.
I don't know why it doesn't working.

Any help is welcome :)
Thanks and regards
Oskar

SSemicolon WebSTAFFJul 18, 2020

Hello,

We have checked out your Website and the css/custom.css File appears to be commented out. Make sure that you completely check the codes.

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard