I'm quite new to the jQuery and GSAP and really need Your help .
I'm having a problem in animating children div while parent element is hover using TweenMax/TimelineMax. I can animate css of children with jQuery like this:
$('.div1').mouseenter(function () {
$('.div2').css('font-size', '20px');
});
but since I want to build a really complex animation I would like to use TimelineMax to my code in place of "css('font-size', '20px');" but nothing seems to work. I've build a simple test.html to find a solution:
<body>
<div id="logo">
<p id="text">TEXT TO BE ANIMATED</p>
</div>
</body>
and I've tried to animate my #text element with this code (obtaining only parent animation):
$(document).ready(function () {
var hoverEffect = $("#logo");
hoverEffect.hover(function() {
TweenMax.to(this, .35, {borderLeft: "15px solid #00b89d"})
}, function() {
TweenMax.to(this, .5, {borderLeft: "0px solid #00b89d"})
});
});
I've also tried jQuery .find() and .children() methods but failed... Thanks in advance for Your help