รูปภาพสไลด์ด้วย Nivo Slider jQuery Plugin

slide_jquery

การทำรูปภาพสไลด์เป็นที่นิยมเนื่องจากมีความสวยงามแล้วยังประหยัดพื้นที่การแสดงผลรูปภาพอีกด้วย โดยในบทความนี้ผมแนะนำการใช้งาน Nivo Slider Jquery Plugin ซึ่งการนำมาประยุกต์ใช้งานได้ง่ายไม่ซ้ำซ้อนและตรงตามความต้องการ อีกทั้งยังมีการปรับแต่งได้มากมาย

เว็บผู้พัฒนา : http://docs.dev7studios.com/jquery-plugins/nivo-slider

ตัวอย่าง (demo)

http://sysapp.itoffside.com/slide/

การติดตั้ง
1. ดาวน์โหลด Nivo Slider jQuery Plugin ได้ที่ คลิกที่นี้เพื่อดาวน์โหลด
2. include ไฟล์ css และไฟล์ js ไว้ใน <head> ของเว็บไซต์คุณ ตามโค๊ดตัวอย่างด้านล่าง
nivo-slider

หากคุณมี jquery.min.js อยู่แล้วคุณไม่จำเป็นต้อง include จาก googleapis.com คุณสามารถ include จากไฟล์ที่มีอยู่แล้วได้โดยไฟล์ jQuery ต้องมีเวอร์ชั่น 1.7 หรือมากว่าขึ้นไป

การใช้งาน
1. ติดตั้งสคริปต์ javascript ไว้ใน <head>

2. เพิ่ม html รูปภาพ

แล้วจะได้ผลลัพธ์ตามรูปภาพด้านล่าง
slide_jquery

สำหรับบทความนี้เป็นเพียงตัวอย่างการใช้งานง่ายๆ สำหรับรูปภาพ slide สวยๆหวังว่าคงเป็นประโยชน์สำหรับหลายๆคน ถ้าหากมีคำถาม comment ด้านล่างได้เลยครับ

You May Also Like

About the Author: Onmobile

โปรแกรมเมอร์
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments