ทำได้ง่ายๆกับเมนู DROP-DOWN สุดเจ๋งด้วยปลั๊กอิน jQuery และ CSS


มาต่อเนื่องครับกับการใช้ปลั๊กอิน jQuery โดยวันนี้จะเป็นการสร้างเมนู drop-down หลายเว็บไซต์ที่มีการพัฒนาเมนูรูปแบบต่างๆมากมายบางคนก็ใช้รูปบ้างเขียน css บ้างก็แตกต่างกันได้ครับโดยเมนูถือว่าเป็นสิ่งสำคัญอีกอย่างหนึ่งสำหรับการพัฒนาเว็บไซต์เพื่อให้ผู้ใช้ได้สามารถเข้าใช้งานในส่วนต่างๆได้อย่าง่ายได้ผู้พัฒนาจะต้องดูส่วนนี้เป็นจุดสำคัญโดยการเลือกใช้รูปแบบเมนูก็น่าสนใจโดยเราจะเห็นว่าเว็บไซต์ทั่วไปจะมีรูปแบบเมนูที่แตกต่างกันได้แนวแต่ความเหมาะสมและพื้นที่ในการออกแบบโดยวันนี้ผมเอารูปแบบของเมนู drop-down หลายรูปแบบที่น่าสนใจครับเป็นอีกเทคนิคที่น่าสนใจครับโดยเมนูมะมีรูปแบบการ drop-down ขึ้นลงทำให้ดูน่าสนใจเรามาลองดูกันดีกว่าครับว่าจะเจ๋งซักแค่ไหน



โค้ดส่วนที่เราจะเพื่อรายการเมนูเข้าไปครับ

1
2
3
4
5
6
7
8
9
10
<div class="cd-dropdown">
    <span>Choose an animal</span>
    <input type="hidden" name="cd-dropdown"/>
    <ul>
        <li data-value="1"><span class="icon-monkey">Monkey</span></li>
        <li data-value="2"><span class="icon-bear">Bear</span></li>
        <li data-value="3"><span class="icon-squirrel">Squirrel</span></li>
        <li data-value="4"><span class="icon-elephant">Elephant</span></li>
    </ul>
</div>


ลองดูแล้วน่าสนใจไมครับสามารถดาวน์โหลดไปลองใช้งานกันได้นะครับหลายรูปแบบหลายเทคนิคน่าสนใจมากครับ


ดาวน์โหลดโค้ด…..!!!



ขอบคุณข้อมูลจาก http://tympanus.net/

Comments

comments

Powered by Facebook Comments