Color tween wont work after changing position from absolute to fixed

[Fredy Rivas]

Hello people!

I have a <nav> with absolute position and inside of it some links <a>. After some scrolling I change its position to fixed to stick it at the top.  (using stickOnScroll plugin)

At the beginning I bind a mouseover to tween color of the text in <a> and works fine, but when I change it to fixed position the tween disappear. 

 

Thank you so much!

<nav class="full-width" id="home_menu">
    <ul class="container">
        <li><a href="javascrip:void(0)">slim center</a></li>
        <li><a href="javascrip:void(0)" id="menu2">tratamientos</a></li>
        <li><a href="javascrip:void(0)">estilo de vida</a></li>
        <li><a href="javascrip:void(0)">por un méxico más sano</a></li>
    </ul>
</nav>



nav#home_menu{
  position: absolute;
  height: 60px;
  top: 700px;
  width: 100%;
  border-top: solid 1px white;
  border-bottom: solid 1px white;
}

nav#home_menu ul{
  min-height: 60px;
  height: 60px;
  top:0;
  width:1200px;
  left:50%;
  ;
}

nav#home_menu ul li{
  display: inline;
  float: left;
}

nav#home_menu ul li a{
  display: inline-block;
  margin-top: 23px;
  width: 295px;
  text-align: center;
}





$("#home_menu").stickOnScroll({
        topOffset: 0,
        setParentOnStick:   true,
        setWidthOnStick:    true,
        onStick: onSticknav
    });






function onSticknav()
{
    $('#menu2').bind('mouseover', overMenu);
}

function overMenu(e)
{
   TweenMax.to($(e.currentTarget), .4, {color:"#009aff"});
}

[Carl]

Sorry, I'm unfamiliar with that stickOnScroll plugin. I find it hard to imagine why changing the position type of an element would interfere with tweening its color.

 

If you can provide a demo that we can test it would be very helpful. We suggest using CodePen as described here: http://forums.greensock.com/topic/9002-read-this-first-how-to-create-a-codepen-demo/

 

on further review, I made a quick demo with your code and the onStickNav plugin:

http://codepen.io/GreenSock/pen/vGkKJ

 

can't seem to replicate the problem as the rollover color change on the 2nd link works before and after the nav gets position:fixed

 

Feel free to fork that demo so that it clearly shows the problem.