|
 |
|
จากสคลิปนี้เมื่อทำการคลิกที่รูปจะทำการ ขยายรูปตามที่เรากำหนดอะคับ |
|
 |
|
|
 |
 |
|
จากสคลิปนี้เมื่อทำการคลิกที่รูปจะทำการ ขยายรูปตามที่เรากำหนดอะคับ
ในส่วน Head
Code
<script>
var nW,nH,oH,oW;
function zoomToggle(iWideSmall,iHighSmall,iWideLarge,iHighLarge,whichImage){
oW=whichImage.style.width;oH=whichImage.style.height;
if((oW==iWideLarge)||(oH==iHighLarge)){
nW=iWideSmall;nH=iHighSmall;}else{
nW=iWideLarge;nH=iHighLarge;}
whichImage.style.width=nW;whichImage.style.height=nH;
}
</script>
ในส่วน body
<!-- ให้คุณดูตรง ปลายๆบรรทัดด้านล่างนี้ครับ ตรง zoomToggle น่ะ ตรงตัวเลข 2ตัวแรก คือขนาดของภาพก่อนที่จะ zoom (เลข 200px กับ 210px อ่ะ) ส่วน 2 ตัวหลังเป็นขนาดของภาพขณะที่ zoom ครับ (เลข 300px กับ 320px อ่ะ) -->
<img border="0" src="dove.gif" width="200" height="210" onclick="zoomToggle('200px','210px','300px','320px',this);">
ในความต้องการของผมนะคับ
สมมุติในหน้าเว็บของเรามีรูปอยู่ 3 รูป
เมื่อคลิกรูปที่ 1 แล้วขยาย และเมื่อจะทำการคลิกที่รูปที่ 2 หรือ 3 อยากจะให้รูปที่ 1 ที่ขยายกลับไปเล็กลงเหมือนเดิมอะคับ โดยที่รูปที่ 2 หรือ 3 ที่คลิกก็ทำการขยายปกติอะคับ
ไม่รู้จะแก้ตรงไหน รบกวนทีคับ
Tag : - - - -

|
|
|
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ทำไมไม่ลองใช้ Jquery ดูคับ
|
 |
 |
 |
 |
Date :
2009-10-17 10:34:59 |
By :
art57110 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|
|

|
Load balance : Server 03
|