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
จากโค้ดนี้น่ะค่ะ หลังจากที่เลือนตำแหน่งจนพอใจแล้ว สามารถจัดเก็บเป็นภาพรวม ได้รึป่าวค่ะ แล้วจะเก็บอย่างไรค่ะ
ช่วยหน่อยน่ะค่ะ
ขอบคุณค่ะ
มีตัวอย่างการ drag drop ตารางเพื่อจัดลำดับ อยู่นะครับ ผมเคยเห็น ลองหาดูจาก google
คือ....ขอถามเรื่องการวนลูปธรรมดาค่ะ
ยังไม่ต้องเลื่อนตำแหน่งค่ะ
คืออยากให้แสดงออกมาก่อน เรื่องการเลื่อนตำแหน่งค่อยว่ากันอีกที
$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 ตัว ได้ป่าวค่ะ
แล้วต้องทำอย่างไรค่ะ
echo "<TD><img src ='../$type_pic' width='50' class='dragme'></TD>";
if($x%30==0){ echo "</TR><TR>"; }
}
เปลี่ยนตัวแปลเป็น $x ด้วยละ รู้สึกว่าจะซ้ำ กะ ลูป while
ขอบพระคุณมาก ๆ เลยค่ะ
ได้แล้ว....ดีใจจัง