Data Tables fijar columna no funciona

Hola encontré DataTables y me encanta, intento fijar la columna izquierda y la derecha pero no me funciona.

¿Qué podría estar mal?

Mi index

Código

 
<html>
 <head>
  <title>Cuadrante de Visitas</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
 
  <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>  
 
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
 
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://markcell.github.io/jquery-tabledit/assets/js/tabledit.min.js"></script>
 </script>
 
<script src="https://cdn.datatables.net/fixedcolumns/3.3.2/js/dataTables.fixedColumns.min.js"></script>
 </head>
 <body>
  <div class="container">
   <h3 align="left">Cuadrante de Visitas</h3>
   <br />
   <div class="panel panel-primary">
    <div class="panel-heading">Anem a més</div>
    <div class="panel-body">
     <div class="table-responsive">
      <table id="personal" class="table table-bordered table-striped">
       <thead class="fixedHeader">
 
        <tr>
         <th>ID</th>
         <th>Osdcar</th>
         <th>Elexna</th>
         <th>Carmden</th>
                  <th>Gar</th>
                    <th>Nacho</th>
         <th>Prado</th>
 
 
        </tr>
       </thead>
       <tbody></tbody>
      </table>
     </div>
    </div>
   </div>
  </div>
  <br />
  <br />
 </body>
</html>
 
<script type="text/javascript" language="javascript" src="script.js"></script>

El script

Código

 
 
$(document).ready(function(){
 
 var dataTable = $('#personal').DataTable({
  "language": {
  "url": "//cdn.datatables.net/plug-ins/1.10.20/i18n/Spanish.json",
"url": "//code.jquery.com/jquery-3.5.1.js",
"url": "//cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js",
"url": "//cdn.datatables.net/fixedcolumns/3.3.2/js/dataTables.fixedColumns.min.js"
  },
"bFilter": false, 
"bInfo": false,
  "processing" : true,
  "serverSide" : true,
"responsive": true,
 "fixedColumns": true,
"paging":false,
        "fixedColumns":   {
            "leftColumns": 1,
            "rightColumns": 1
        },
  "order" : [],
  "ajax" : {
   url:"datos.php",
   type:"POST"
  }
 
 
 
 
 
 
 });
 
 $('#personal').on('draw.dt', function(){/*`Oscar``Elena``Carmen``Ga``Nacho``Prado`*/
  $('#personal').Tabledit({
   url:'edicion.php',
   dataType:'json',
   columns:{
    identifier : [0, 'idp'],
	editable:[[1, 'Oscar'], [2, 'Elena'], [3, 'Carmen'],[4, 'Ga'],[5, 'Nacho'],[6, 'Prado']]
   },
   restoreButton:false,
   onSuccess:function(data, textStatus, jqXHR)
   {
    if(data.action == 'delete')
    {
     $('#' + data.idp).remove();
     $('#personal').DataTable().ajax.reload();
    }
   }
  });
 });
 
});