javascript เลื่อนตำแหน่งภาพได้ในทุกที่ บนหน้าเว็บ

<HEAD>

<style>.dragme{position:relative;}</style>
<script language="JavaScript1.2">
<!--
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var dobj;
function movemouse(e){
  if (isdrag)  {
    dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
    dobj.style.top  = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
    return false;
  }
}
function selectmouse(e) {
  var fobj = nn6 ? e.target : event.srcElement;
  var topelement = nn6 ? "HTML" : "BODY";
  while (fobj.tagName != topelement && fobj.className != "dragme")  {
    fobj = nn6 ? fobj.parentNode : fobj.parentElement;
  }
  if (fobj.className=="dragme")  {
    isdrag = true;
    dobj = fobj;
    tx = parseInt(dobj.style.left+0);
    ty = parseInt(dobj.style.top+0);
    x = nn6 ? e.clientX : event.clientX;
    y = nn6 ? e.clientY : event.clientY;
 x = x + 50;
 y = y + 50;
 document.onmousemove=movemouse;
 document.x.y.value = x;
 document.x.z.value = document.x.y.value;
    return false;
  }
}
function setvar() { document.x.y.value = "abc"; }
document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false");
// -->

</script>


 </HEAD>


 
<?
echo "<table  border='0' cellpadding='0' cellspacing='0' bordercolor='#000000' align = center>";
echo "<TR>"; 
include("dbconnect.php");
$sql = "select * from planddetail inner join producttype on planddetail.type_id = producttype.type_id  where  pland_id='$pland_id' ";
$db_query = mysql_db_query($db,$sql);
$num_rows = mysql_num_rows($db_query);
$result = mysql_query($sql);

$i = 1;
while($row=mysql_fetch_array($result))  {
$type_id = $row[type_id];
$type_pic = $row[type_pic];
$pd_amount = $row[pd_amount];
for($i=1;$i<=$pd_amount;$i++){

  echo "<TD><img src ='../$type_pic' width='50' class='dragme'></TD>";

}
echo "</TR>";
$i++;
  }

echo "<form name=x>";
echo "<input name=y value=0  type='hidden'>";
echo "<input name=z value=0 type='hidden'>";
echo "</form>";

echo "</TABLE>";


จากโค้ดนี้....น่ะค่ะ  ได้มาจากในเว็บ เอามาประยุกต์เป็นของตัวเองแล้ว ติดปัญหานิดหน่อย  เลยมาขอความช่วยเหลือค่ะ

คำถามที่  1

       วนลูปข้อมูลแล้วจะแสดงข้อมูลตามจำนวน pd_amount  ถ้า pd_amount = 100  ก็จะแสดง บรรทัดละ 100

ถ้าจะให้  แสดง บรรทัดละไม่เกิน  30 ละค่ะ ต้องทำอย่างไรค่ะ  ????

คำถามที่  2  

       จากโค้ดนี้น่ะค่ะ   หลังจากที่เลือนตำแหน่งจนพอใจแล้ว  สามารถจัดเก็บเป็นภาพรวม ได้รึป่าวค่ะ  แล้วจะเก็บอย่างไรค่ะ

 
ช่วยหน่อยน่ะค่ะ

ขอบคุณค่ะ

 

30 ม.ค. 2553 4 2,959

คำตอบคือ ไม่ได้ครับ เพราะ เราไม่สามารถระบุ order ได้เลย

มีตัวอย่างการ drag drop ตารางเพื่อจัดลำดับ อยู่นะครับ ผมเคยเห็น  ลองหาดูจาก google
#1


คือ....ขอถามเรื่องการวนลูปธรรมดาค่ะ

ยังไม่ต้องเลื่อนตำแหน่งค่ะ

คืออยากให้แสดงออกมาก่อน    เรื่องการเลื่อนตำแหน่งค่อยว่ากันอีกที
 
$i = 1;
while($row=mysql_fetch_array($result))  {
$type_id = $row[type_id];
$type_pic = $row[type_pic];
$pd_amount = $row[pd_amount];
for($i=1;$i<=$pd_amount;$i++){

  echo "<TD><img src ='../$type_pic' width='50' class='dragme'></TD>";

}
echo "</TR>";
$i++;
  }


จากการวนลูปข้างต้น

สามารถ วนลูป แล้ว  แสดงค่า  บรรทัดละไม่เกิน  30 ตัว ได้ป่าวค่ะ

แล้วต้องทำอย่างไรค่ะ




 

#2

for($x=1;$x<=$pd_amount;$x++){
    echo "<TD><img src ='../$type_pic' width='50' class='dragme'></TD>";
    if($x%30==0){ echo "</TR><TR>"; }
}

เปลี่ยนตัวแปลเป็น $x ด้วยละ รู้สึกว่าจะซ้ำ กะ ลูป while
#3

เยี่ยมเลยค่ะ  

ขอบพระคุณมาก ๆ เลยค่ะ

ได้แล้ว....ดีใจจัง

 
#4
ความคิดเห็น
ไฟล์อัปโหลด ชนิด jpg, jpeg ขนาดไฟล์ไม่เกิน 1024
^