javascript - In between parent and iframe: mouseover/out combined with click behavior -

javascript - In between parent and iframe: mouseover/out combined with click behavior -

i new in programming. please give me mercy. according post mouseover/out combined click behavior . inquire farther question since still cannot accomplish task.

here below code:

child.html

<div id="custom_div">this div highlighted</div>

parent.html

<iframe id="iframeid" src="child.html"></iframe> <a href="#" id="custom_link">click highlight custom div in child.html</a> <script> $('#iframeid').contents().find('#custom_div'); $('#custom_link').hover(function () { $('#custom_div').toggleclass('highlight'); }); $('#custom_link').click(function (e) { $('#custom_div').addclass('highlight'); $(e.currenttarget).unbind('mouseenter mouseleave'); }); </script>

what want is:

when user hovers mouse on "custom_link", "custom_div" beingness highlighted. when user moves mouse out off "custom_link", highlight @ "custom_div" eliminated. when user clicks @ "custom_link", "custom_div" beingness highlight. however, when user moves mouse out, 'highlightdiv' still beingness added "custom_div".

could please help me dissolve this? sought lot of "accessing iframe element jquery" issue ,however, still cannot understand. nice if provide jsfiddle illustration well.

if have understand requirement should resolve issue

<script type="text/javascript"> $(window).load(function (){ var triggered_div = $('#iframeid').contents().find('#custom_div'); $('#custom_link').hover(function () { triggered_div.toggleclass('highlight'); }); $('#custom_link').click(function (e) { triggered_div.addclass('highlight'); $(e.currenttarget).unbind('mouseenter mouseleave'); }); }); </script>

javascript jquery html css