1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

jQuery code not working on my HTML page

Discussion in 'jQuery' started by xms, May 16, 2017.

0
  1. #1
    Here is the whole HTML document. jQuery does not not work at all. Where is the problem?

    
<html>

<head>
  <title>Test</title>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  <script type="text/javascript">

  var container = $('div'),
  scrollTo = $('#td9');

  container.animate({
  scrollLeft: scrollTo.offset().left - container.offset().left + container.scrollLeft()
  });

  $('div > input').each(function() {
  var radioInput = $(this);

  if(radioInput.is(':checked')) {
  $('div').animate({
  scrollLeft: radioInput.offset().left - $('div').offset().left + $('div').scrollLeft()
  }, 2000);
  }
  });

  $('input[type=radio]').on('change', function() {
  if($(this).is(':checked')) {
  $('div').animate({
  scrollLeft: $(this).offset().left - $('div').offset().left + $('div').scrollLeft()
  }, 2000);
  }
  });

  </script>

  <style>

  div {
  width: 100px;
  height: 70px;
  border: 1px solid blue;
  overflow: auto;
  }

  </style>
</head>

<body>
  <div>
  <table id="my_table">
  <tr>
  <td id='td1'><input type="radio" name="distance" value="1" />111111</td>
  <td id='td2'><input type="radio" name="distance" value="2" />222222</td>
  <td id='td3'><input type="radio" name="distance" value="3" />333333</td>
  <td id='td4'><input type="radio" name="distance" value="4" />444444</td>
  <td id='td5'><input type="radio" name="distance" value="5" />555555</td>
  <td id='td6'><input type="radio" name="distance" value="6" />666666</td>
  <td id='td7'><input type="radio" name="distance" value="7" />777777</td>
  <td id='td8'><input id="radio8" type="radio" name="distance" value="8" />888888</td>
  <td id='td9'><input type="radio" name="distance" value="9" checked="checked" />999999</td>
  </tr>
  </table>
  </div>
</body>
</html>
    HTML:

     
    Solved! View solution.
    xms, May 16, 2017 IP
  2. #2
    Well, first of all, you're missing the 
    
$(document).ready(function() {})
    Code (markup):
    wrapper.
     
    PoPSiCLe, May 16, 2017 IP