Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
mikel

Handle size of backgroundimage

Recommended Posts

Hi,

 

can´t handle size from 220% to 100% - see Codepen.

 

Best regards

Manfred

See the Pen waxKxL by mikeK (@mikeK) on CodePen

Link to comment
Share on other sites

Hi mikel :)

 

pls try this :

TweenMax.to(".slide01",3,{ backgroundSize:"100% 100%" })

and in your css :

background-size: 220% 220%;
  • Like 1
Link to comment
Share on other sites

Hi Diaco,

 

thanks for Your advice.

 

My problem: one value = image keeps ratio (window resize); two values and the ratio will be deformed.

 

Is there another way?

 

Best regards

Manfred

Link to comment
Share on other sites

pls try this :

TweenMax.to(".slide01",3,{'background-size':'100%'});
  • Like 2
Link to comment
Share on other sites

Hi Diaco

 

Thanks a lot. That´s great. After frustrating hours I´m really happy.

 

Best regards

Manfred

Link to comment
Share on other sites

  • 8 months later...

Nice Diaco,

 

What is happening mikel, is if width or height is omitted the spec states that the component, in this case (height) will be set to auto and then will have its dimension calculated.

 

Please see background-size spec:

  • If the background-size has one auto component and one non-auto component:
    If the image has an intrinsic proportion, then render it using the specified dimension, and compute the other dimension from the specified dimension and the intrinsic proportion.  If the image has no intrinsic proportion, use the specified dimension for that dimension.  For the other dimension, use the image's corresponding intrinsic dimension if there is one.  If there is no such intrinsic dimension, use the corresponding dimension of the background positioning area.

https://developer.mozilla.org/en-US/docs/Web/CSS/background-size

 

:)

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×