javascript - 2 window.parent.onscroll calls on page do not work -
i have html page 2 iframes within it. want each iframe display y scroll offset of parent window. 1 iframe works on page load, other not.
the parent html page has iframe embeds. here code running in iframe:
function run(){ document.write("<div id='scrolly' style='float:left;'></div><br>"); scrolly = 'no'; document.getelementbyid("scrolly").innerhtml = scrolly; window.parent.onscroll = function(){ scrolly = window.parent.pageyoffset; document.getelementbyid("scrolly").innerhtml = scrolly; } } run(); the result on load , scroll downwards display like:
iframe1 = 100 iframe2 = no can call window.parent.onscroll once? doesn't seem right me.
this happening because in both frames, window.parent makes reference same window object, , setting onscroll property/event on same object, twice. means second time around set window.parent.onscroll property, you're overwriting first attempt set event, , you're overwriting second frame's window.document object, why updates contents of elements in second frame.
to overcome issue, can use addeventlistener instead of onscroll:
function run() { document.write("<div id='scrolly' style='float:left;'></div><br>"); scrolly = 'no'; document.getelementbyid("scrolly").innerhtml = scrolly; window.parent.addeventlistener('scroll', function() { scrolly = window.parent.pageyoffset; document.getelementbyid("scrolly").innerhtml = scrolly; }); } addeventlistener allows set multiple events of same type same element, while .onstuff listeners don't.
Comments
Post a Comment