How can I shorten my js code

[AsKadir]

Hello!

Can I short my js code if I have two divs with the same TweenMax parameters?

HTML:

<div class="nav-content"></div>
<div class="menu-mark-container"></div>

JS: 

var tl = TweenMax;

tl.to('.nav-content', 0.5, {x: "500%", ease: Expo.easeInOut});
tl.to('.menu-mark-container', 0.5, {x: "500%", ease: Expo.easeInOut});
  });

 

 

 

Can we just wrote two divs in one TweenMax?

Thanks a lot.

See the Pen pXJEbq by ChicagoJostik (@ChicagoJostik) on CodePen

[Visual-Q]

var tl = TweenMax;
$('.move').click(function(){
tl.to('.nav-content,.menu-mark-container', 0.5, {x: "500%", ease: Expo.easeInOut});
  });

 

Or give them a common class and animate that

 

<div class="animate nav-content"></div>
<div class="animate menu-mark-container"></div>
<button class="move">move</button>


var tl = TweenMax;
$('.move').click(function(){
tl.to('.animate', 0.5, {x: "500%", ease: Expo.easeInOut});
  });

 

[AsKadir]

17 hours ago, Visual-Q said:

var tl = TweenMax;
$('.move').click(function(){
tl.to('.nav-content,.menu-mark-container', 0.5, {x: "500%", ease: Expo.easeInOut});
  });

 

Or give them a common class and animate that

 

<div class="animate nav-content"></div>
<div class="animate menu-mark-container"></div>
<button class="move">move</button>


var tl = TweenMax;
$('.move').click(function(){
tl.to('.animate', 0.5, {x: "500%", ease: Expo.easeInOut});
  });

 

Sorry for this silly question) I can’t understand how I didn’t  guess.

Thanks a lot!