ทำRollover Image แบบไม่ง้อ javascript by akara
Aug2
ปกติแล้วเวลาที่เราจะทำ rollover image เพื่อมาใช้ในเวปไซต์ของเราเนี่ย
เราก็มักจะใช้ javascript ในการทำใช่ไหมครับ
(ที่บอกว่าส่วนใหญ่ใช้วิธีนี้เพราัะว่ามันติดมากับโปรแกรม Dreamweaver ครับ)
ซึ่งจริงๆแล้วเราไม่จำเป็นต้องใช้วิธีนั้นเลยครับ ใช้แค่ CSS อย่างเดียวก็พอแล้ว
วิธีการก็ไม่ยากเลยครับ
รูปที่ใช้ button_1.gif ขนาด100x50px
รูปที่ใช้ตอน rollover button_1_over.gif ขนาดเท่ากัน
จากนั้น อันนี้คือส่วนของ css ครับ
a.image{
display:block;
width:100px;
height:50px;
background:url(‘button_1.gif’) no-repeat;
}
a.image:hover{
background:url(‘button_1_over.gif’) no-repeat;
}
แล้ว html เราก็แค่ใส่ class ให้ tag a เท่านั้นเองครับ
เห็นไหมครับไม่ยากเลย….
แต่เดี๋ยวก่อน! ผมยังมีของเด็ดกว่านี้อีก
คือ การใช้รูปเพียงรูปเดียวในการทำ rollover image
นี่คือไฟล์รูปครับ ลองคลิกขวาดูได้ครับ จะเห็นว่าเป็นรูปเดียว
ที่มีขนาด 100x105px
จากนั้นเรามาเปลี่ยน css กันซักหน่อยครับ เป็น
a.image_single{
display:block;
width:100px;
height:50px;
background:url(‘button_1_single.gif’) 0 0 no-repeat;
}
a.image_single:hover{
background:url(‘button_1_single.gif’) 0 -55px no-repeat;
}
รูปที่ทำจากวิธีนี้จะเป็นรูปด้านล่างนะครับ จะเห็นได้ว่าไม่แตกต่างกันเลย ประหยัดไปไฟล์นึงด้วยนะเอ้อ
edit @ 31 Aug 2009 19:30:15 by Akara_gat
แผนธุรกิจ – ลายแทงสมบัติแห่งโลกธุรกิจ by plug.in
Aug1
แผนธุรกิจ คืออะไร?
แผนธุรกิจคือแผนการในการดำเนินธุรกิจที่จัดทำขึ้นเพื่อเป็นแนวทางในการดำเนินกิจการของธุรกิจ ซึ่งจะจัดทำให้ครอบคลุมทุกๆด้าน ทั้งด้านการตลาด การบริหาร และ ฝ่ายบุคคล และที่สำคัญที่สุดคือด้านการเงิน ว่าคุ้มหรือไม่ที่จะลงทุนเริ่มทำกิจการหรือไม่? และเป็นการวางกำหนดการ และเป้าหมาย ที่ต้องการไว้เป็นแนวทางในการดำเนินการบริษัทด้วย
เริ่มต้นกับการเขียน Facebook Application สำหรับผู้เริ่มต้น (PHP) (3) by heha
Aug9
ต่อเนื่องจากคราวที่แล้ว หัวข้อ เริ่มต้นกับการเขียน Facebook Application สำหรับผู้เริ่มต้น (PHP) (2) คราวนี้จะเป็นการแนะนำ function การใช้งานที่ใช้บ่อยๆ สรุปให้ครับ