Keeping A Fixed Position

brown2005 · November 15, 2012

<!DOCTYPE html>


<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->

   <head>

 <meta charset="UTF-8" />

 <title></title>


       <link rel="stylesheet" href="style.css" />


 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>        
 <script type="text/javascript" src="script.js"></script>
 <script type="text/javascript">

  $(document).ready(function(){ 

   $("#game-details ul").sortable({ opacity: 0.8, cursor: 'move', update: function() {

 var order = $(this).sortable("serialize") + '&update=update'; 

 $.post("updateList.php", order, function(theResponse){

 });			     
   }

   });

  });

 </script> 

</head>

<body>


 <div id="website">

  <div id="game-details">

   <ul>

 <?php

  include("connect.php");

  $query  = "SELECT id, text FROM dragdrop ORDER BY listorder ASC";

  $result = mysql_query($query);

  $i = 1;

  while($row = mysql_fetch_array($result, MYSQL_ASSOC)){

   $id = stripslashes($row['id']);
   $text = stripslashes($row['text']);

   echo' <li id="arrayorder_'.$id.'">

	  <div class="position">'.$i.'</div>
	  <div class="team">'.$text.'</div>
	  <div class="transfers">transfers</div>
	  <div class="last>last year</div>
	  <div class="clear">wertret</div>

	 </li>';

   $i ++;

  } 

 ?>

      </ul>

  </div>

  <div id="game-info">

   <dl class="gameinfo" id="slider1">

 <dt>How To Play</dt>
  <dd>
   <p>Drag and drop your teams into the order you think they will finish the 2013-2014 Premier League.</p>							 
   <p>With each drag and drop your league table is automatically updated.</p>									
  </dd>

 <dt>Scoring</dt>
  <dd>
   <p>You score points based on the number of correct positions you have at the end of the season:</p>
   <p>1 correct<span>10 pts</span></p>						   
   <p>5 correct<span>50 pts</span></p>									
   <p>10 correct<span>100 pts</span></p>
   <p>15 correct<span>150 pts</span></p>
   <p>20 correct<span>200 pts</span></p>					
  </dd>

   </dl>

  </div>

 </div>


 <script type="text/javascript">

  var slider1=new accordion.slider("slider1");
  slider1.init("slider1",0,"open"); 


 </script>

</body>

</html>

i have the above code which works on www.richardbrown.name where you can drag and drop the left content, but what i want to do is keep the numbers on the left in order after every drop!

thanks in advance.

Jessica · November 16, 2012

Use an ol instead...

Sign In

Keeping A Fixed Position

Recommended Posts

brown2005

Link to comment

Share on other sites

Jessica

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information