Databases
StackOverflow2013
Postsdbo
POjQuery Mobile: how to detect when one moving image hovering over the button
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery Mobile: how to detect when one moving image hovering over the button
    text
    copied!<p>In my mobile app, I need to move a green image around the web page. When the green image hover over the submit button, the button will show "Submit?", and when the user droped the green image on the submit button, the button will turn to orange.</p> <p>Here's the pictures:</p> <p><img src="https://i.stack.imgur.com/6SZhn.jpg" alt="The first picture is when the users droped the green image"></p> <p><img src="https://i.stack.imgur.com/lqfgK.jpg" alt="The second shows when the green image hovers over the button, what the button should show"></p> <p><strong>The problem</strong> is when the green image hover over the button, the button cannot change, only when I touch the button it can change. I have tried hover() and mouseover() method, all didn't work. It is <strong>jQuery Mobile</strong>, in my PC version, everything worked very well, but mobile app is different.</p> <p><strong>So, what can I do so that when the green image hovering over the button, it can show "Submit?"? Or is there any way to detect the object is Yes or No button when the green image hoving over one of them?</strong></p> <p>here's the code: The drag and drop methods are from another JS file, but should not influence this question.</p> <pre><code>id = "html"; $(id).ready(function (e) { $('.yes').bind('mouseover', function( event, ui ){ $('.yes').attr("src","images/submit_confirm.png"); $('input[name=stimulusResponse]').val("yes"); $('.no').attr("src","images/no.png"); }); $('.no').mouseover(function( event, ui ){ $('.no').attr("src","images/submit_confirm.png"); $('input[name=stimulusResponse]').val("no"); $('.yes').attr("src","images/yes.png"); }); $('.bottomGoButton').drag(function( ev, dd ){ $( this ).css({ top: dd.offsetY, left: dd.offsetX }); $(this).bind('vmousemove', function(event) { $('input[name=test]').val(event.pageX + ", " + event.pageY + $('input[name=test]').val()); }); }); $('.no').drop(function(){ $('input[name=stimulusResponse]').val("no"); $('.no').attr("src","images/submitted_no.png"); }); $('.yes').drop(function(){ $('input[name=stimulusResponse]').val("yes"); $('.yes').attr("src","images/submitted_yes.png"); }); </code></pre> <p>}); </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload