ปุ่ม "สารบัญ" อยู่ตำแหน่งบนขวาสุดใช้เพื่อดูหัวข้อบทความทั้งหมดของบล็อกนี้ครับ
Loading...

วันเสาร์ที่ 25 กรกฎาคม พ.ศ. 2552

การสร้าง Float Image ให้กับบล๊อกของเรา

Float Image คือ การสร้างรูปภาพให้ลอยอยู่ ณ ตำแหน่งใด ๆ ของหน้าเว็บ ซึ่งประโยชน์ของการใช้ส่วนใหญ่จะเป็นโฆษณาและนิยมให้อยู่ที่มุมใดมุมหนึ่งของหน้าเว็บดังตัวอย่าง



เราสามารถที่จะสร้าง Float Image หรือรูปภาพให้ลอยอยู่ในหน้าบล๊อกของเราได้ด้วยวิธีง่าย ๆ ดังนี้
  • ไปที่ รูปแบบ | แก้ไข HTML
  • ค้นหา Code ]]></b:skin> แล้วคัดลอก Code ต่อไปนี้ไว้ด้านบน
#float_corner {
position:fixed;_position:absolute;
bottom:0px;left:0px;clip:
inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);}


*botton และ left คือ ตำแหน่งที่ต้องการให้รูปภาพนั้นแสดงในหน้าบล๊อก สามารถเปลี่ยนเป็น top, bottom, left หรือ right ได้
  • ขั้นตอนถัดไป คือ ให้ค้นหาคำว่า </body> แล้วคัดลอก Code ต่อไปนี้ไว้ด้านบน
<div id='float_corner'>
<a href='http://blogger-assistant.blogspot.com'> <img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgijblXT36-XGwdyQjKXU_IO25QjPrmDn2o6Hu_wfnnN6qXnsQw4rjTlN2arDq0S8Q0a175RfRc2yOKgppCDfe-9v_R6sP00I-DS7JtMCjk4PFWUEHRrWtYOQR0c2K9jE2ElEChrVmWFfci/'/></a>
</div>


http://blogger-assistant.blogspot.com คือ ลิงค์ที่ต้องการ

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgijblXT36-XGwdyQjKXU_IO25QjPrmDn2o6Hu_wfnnN6qXnsQw4rjTlN2arDq0S8Q0a175RfRc2yOKgppCDfe-9v_R6sP00I-DS7JtMCjk4PFWUEHRrWtYOQR0c2K9jE2ElEChrVmWFfci/ คือ URL รูปภาพที่ต้องการ

สามารถ ดูตัวอย่าง ได้ที่นี่

0 ความคิดเห็น:

 
TopBottom