kmytor

Thank you It works but you have not expected something different The solution is like a demonstration. It would be but with. I have the problem I can only change one element, as I do to be more elements, I have to make a variable (var = name) for each element. example var newColor2 = window.innerWidth <737? "0": "0.5"; tl.to (".boxTarget", 1, {opacity: newColor2}); etc, etc...

And in this my other example the achieved an important breakthrough but I can not get the animation on mobile I hope you manage to understand what I need to do

Hello I understand you I do not explain myself very well, forgive me ... I made another example with the example that you made me but I am not very expert in programming, I defend myself with the basics and I wanted to do something more advanced but when I saw that it did not fit in the mobile I was forced to try a conditional so that it fits the animations look this is my example

but this function does not change to red color it only changes when you put it like that > 737 and what I need is that it works in both yellow and red depending on the size of the screen and here is not happening

Hello again me I can not or better said nose now load the variable but with animations loaded

I am sorry if I publish it in many parts it is that I need an answer that I do not have and nobody thinks that I understand what I want to do, I'm sorry I'm going to put it another way to see if you understand me. function intro() { if (window.matchMedia('(max-width: 320px)').matches) ) { var tlintro = new TimelineMax(); console.log("load desktop"); } else { var tlintromobile = new TimelineMax(); console.log("load mobil"); }

AnimaWeb.to(".ass picture", 1, { top: "-=50%", delay: 0 }) .to(".ass picture", 5, { top: "30%", position:"fixed", filter: "blur(0px)", delay: 0 }) //how do you do this if (window.matchMedia('(max-width: 320px)').matches) { TweenMax.from(".ass picture", 5, { opacity: ".5", delay: 1 }) } else { TweenMax.from(".ass picture", 1, { opacity: "1", delay: 1 }) } .to(".ass picture", 1, { top: "90%", scale: 0.1, filter: "blur(15px)", delay: 0 }) .to(".bg", 2, { top: "+=200%", delay: -1 });

disclpa another question There is a way to make a condition within a timeline like this here:

or by God as I do not fix many thanks. but I do not understand why it was done with this action AnimaWeb.set (". ass picture", {position: 'fixed'}); ???

I have a similar problem and I do not know what can help you, and I can not make it work in codepen either Thank you

hello, again me they can help me I have two other problems I am not a programmer and I am in the apprenticeship I'm trying to make scrollmagic work in codepen.io the other thing is that I want this chain of aniamacion to run but it does not hold anything if (window.matchMedia('(max-width: 320px)').matches) { TweenMax.from(".astro1 picture", 5, { top: "0%", delay: 1 }) } Uncaught SyntaxError: Unexpected token if Gracias

Hello, thank you very much clarify many doubts and apologize not to be more clear is that we understand well what I was doing with the code this is the exercise queria hacer una sola cadena de animacion para hacer estos eventos al tiempo, delay, opacity y lo tenia estructurado de esta manera var tlOpen = new TimelineMax(); var tltwo= new TimelineMax("[.intro", ".foto", ".rules"]); tlOpen .to(".intro", 0.2, { opacity: 0 display: "none", delay: 0 }) .to(".rules", 0.3, { opacity: 0 }) .to(".rules", .1, { opacity: 0 display: "none", delay: 0 }) .to(".name", 0.5, { opacity: "0", ease: Power4.easeOut }); and what I want is this because I have many animated chains for this style and it is very long var tlOpen = new TimelineMax(); var close= new TimelineMax("[.intro", ".foto", ".rules"], 1, { opacity: 0, display: "none", }); tlOpen .to(".one", 0.2, { opacity: 0 display: "none", delay: 1 }) close("0"), //how to make it work in this part or load ? .to(".tres", .1, { opacity: 0 display: "none", delay: 3 }) });

multiple css in a variable can help me I'm not very good programming and I do not achieve this example var close = new TimelineMax([".intro"], [".photo"], [".rules"]); TweenMax.from(close, 1, { display: 'none', delay: 0.5 }) Help!