About jQuery, why does the mouseenter() on a <input> not work? -


thanks checking post first!

the mouseenter() working tag h2, not work on <input>. tell wrong code?

$(document).ready(function() {    $("h2").mouseenter(function() {      $(this).css("background-color", "green");    });      $("input").mouseenter(function() {      $(this).css("background-color", "green");    });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <div>    <h2>select gaming time:</h2>    <form method="post">      <input type="radio" name="time" value="5">5 minute (hard) &nbsp;&nbsp;&nbsp;&nbsp;      <input type="radio" name="time" value="8">8 minutes (normal) &nbsp;&nbsp;&nbsp;&nbsp;      <input type="radio" name="time" value="10">10 minutes (easy)    </form>  </div>

you trying turn radio button's background green. unfortunately can't done. can wrap text next radios in label , turn label's background green.

as added benefit can make label clickable using for="" attribute , corresponding id=""s.

also, this can done using css only h2:hover, label:hover { background- color: green; }. saving lot of bytes load!

a. wolff's code copied on jsfiddle:

$(document).ready(function () {      $("h2").mouseenter(function () {          $(this).css("background-color", "green");      });        $("label:has(:radio)").mouseenter(function () {          $(this).css("background-color", "green");      });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <div>        <h2>select gaming time:</h2>        <form method="post">          <label for="time_5">              <input type="radio" name="time" value="5" id="time_5">5 minute (hard) &nbsp;&nbsp;&nbsp;&nbsp;</label>          <label for="time_8">              <input type="radio" name="time" value="8" id="time_8">8 minutes (normal) &nbsp;&nbsp;&nbsp;&nbsp;</label>          <label for="time_10">              <input type="radio" name="time" value="10" id="time_10">10 minutes (easy)</label>      </form>  </div>


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -