this regards previous question: absolute div keeps on flickering if move mouse
i solved problem adding few distance between mouse pointer , div keep solution now.
i on next phase of implementation:
what want happen $.ajax call server set div's html depending on it's value/content(?) of image once mouse entered img.
this initial attempt:
var $divt = $('div#test') $('img#sorc').on({ hover: function (e) { alert('enter'); //wont work }, mousemove: function (e) { $divt.css({ 'display': 'block', 'top': e.pagey, 'left': e.pagex + 15 }); }, mouseleave: function () { $divt.css('display', 'none'); } }); i decided use hover ajax call happen once user's mouse entered img didn't result , alert box not triggering. can preload div data server want make code dynamic , reusable refraining hardcoding anything. want execute ajax call once , not everytime user moves mouse around image. how can achieve that?
if purpose when mousein $.ajax , measure x,y in box,when mouseout css change , doesn't measure x,y anymore.this may help:
<!doctype html> <html> <head> <title></title> <script type="text/javascript" src="./jquery-1.11.3.min.js"></script> </head> <body> <img id="sorc" src="./1.jpg" alt=""> <script type="text/javascript"> $("img#sorc").hover(function() { alert("in") ; $("img#sorc").mousemove(function(e) { console.log(e.pagex) ; console.log(e.pagey) ; }); }, function() { alert("out") ; $("img#sorc").unbind(onmousemove) ; }); </script> </body> </html>
Comments
Post a Comment