Bankkrutin's Blog

วันนี้เขียนบทความแบบQuick ๆ สั้นๆใช้เวลาเขียนไม่กี่นาที  (ปกติเขียนเป็นชั่วโมง)

เนื่องด้วยความต้องการส่วนตัวที่อยากจะแชร์ภาพ Before / After  (ภาพเดิม / ภาพที่ตกแต่ง) ด้วยวิธีการลากเม้าท์ดูความเปลี่ยนแปลง
เลยพยายามหา Tool สำหรับเปรียบเทียบภาพอยู่หลายวัน และก็ได้ไปเจอตัวนึงที่น่าสนใจมาแชร์ให้กัน

เว็บนี้ >>  https://juxtapose.knightlab.com/

ใช้สำหรับเปรียบเทียบภาพ Before / After
ตัวอย่าง

คลิก1

คลิก2

คลิก3

คลิก4

คลิกเยอะจังวุ้ย 555


วิธีการใช้ไม่ยาก 

1. เข้าเว็บนี้  https://juxtapose.knightlab.com/

2. อัพโหลดรูปภาพที่ต้องการ 2 รูป จากเว็บอะไรก็ได้  (Photobucket,Google รูปภาพ , flickr บลาๆ)

3. นำ URL ที่ลงท้ายด้วยนามสกุลไฟล์รูปภาพ  (.JPEG , .PNG ) มาใส่ในช่อง 1 และ 2 รวมทั้งใส่คำอธิบาย

4. กด เลข 3  เพื่อ Update Preview รูปที่เราใส่เข้าไป

5. กด เลข 4 เพื่อ Publish รอแปปนึง ระบบจะทำการ Auto Generate Code ให้ทางขวา

6. Copy ตั้งแค่ https จนถึงตัวก่อนเครื่องหมาย "

จะได้ราวๆนี้ https://cdn.knightlab.com/libs/juxtapose/latest/embed/index.html?uid=89b0be06-eead-11e5-a524-0e7075bba956

เอาไปแปะเป็น URL ใช้ได้เลย

คลิกเพื่อดูรูปใหญ่ได้นะ

ปล. ถ้าCopyทั้งหมดสามารถเอาไปใช้ในเว็บได้ด้วย ตัวอย่างก็รูปอันแรกนะแหละ

<iframe class="juxtapose" frameborder="0" height="360" src="https://cdn.knightlab.com/libs/juxtapose/latest/embed/index.html?uid=327a7b28-eeac-11e5-a524-0e7075bba956" width="100%"></iframe>