javascript - hover in one div that trigger the effect hover in another -

javascript - hover in one div that trigger the effect hover in another -

i have problem: have effect hover in 1 div, trigger effect when cursor hover div. like:

<div id='mouse-hover-in-this-div'> blablabla <div id='should-trigger-mouse-hover-in-this-div'></div> </div>

i see solutions here did not work. in particular tried alter css property of inner div jquery .css method did not succed in giving next option:

-webkit-transform: translatey(16px); transform: translatey(16px); -webkit-animation-name: hang; animation-name: hang; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate;

the hover want assing library hover.css, want bounce effect of arrow triggered when whole div hover, not little arrow. there solution problem?

demo

#outside-box:hover .animated-div { -webkit-transform: translatey(6px); transform: translatey(6px); -webkit-animation-name: hang; animation-name: hang; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }

javascript jquery html css hover