post image

Dropdown Menu II – Vnexpress Style

Có lẽ Dropdown menu là loại menu phổ biến nhất hiện nay, trước đây tôi đã có một vài video nói về Dropdown menuFlyout menu với CSS và cả jQuery. Nhưng có nhiều người email hỏi tôi cách làm menu giống với trang Vnexpress.net. Tôi có trả lời nhiều lần là về nguyên lý nó giống y như phần Dropdown menu chỉ cần chỉnh sửa một chút. Nhưng đến hôm nay tôi quyết định làm hẳn một video để giải thích cho rõ hơn.

Trong bài này tôi sẽ không làm kỹ phần xây dựng code HTML và giải thích kỹ phần CSS. Bởi vì trong video trước tôi đã nói rất kỹ về vấn đề này. Do vậy trong phần này nếu có chỗ nào bạn không hiểu hoặc thấy lờ mờ. Hãy xem video trước để biết thêm chi tiết. Để Menu có thể hiển thị được với trình duyệt IE 6, bạn cần download file whatever.htc đi kèm với source code của tut này. Bạn cũng có thể dùng Javascript để khắc phục. Nhưng đơn giản hơn có lẽ là sử dụng file .htc.

Thời lượng: 23:17

Download định dạng .avi chất lượng cao: MediaFire

Dung lượng: 154MB

Get the Flash Player to see this content.

«

»

  1. Đăng Nam says:

    Đúng thế anh ạ! Ngay từ lần xem video em đã liên tưởng đến cái menu của vnexpress thấy nó chỉ khác nhau có đúng 1 điểm là trải rộng hay trải ngang ra thôi. Chỉnh display là được mà.

  2. Đăng Nam says:

    “trải dọc hay trải ngang” Em dạo này hay nói nhịu :D

  3. học hỏi says:

    hơ hơ
    ko thấy biểu tượng play video ngoài màn hình
    tưởng là TUT chữ

  4. Sếu Già says:

    Có vậy mà bạn cũng phải nói nữa. Spam quá!

  5. Tung says:

    Mình thấy trong bài này phần trang wordpress có phàn trình diễn ảnh rất hay
    Tiện thể cho mình hỏi cách làm được không vậy
    Thank you rất nhiều

  6. Demon Warlock says:

    Ban xem trong mục Wordpress bài image slider

  7. kakakatt says:

    Bác DW cho em hỏi là, bác làm sao canh cái chữ nó vô giữa hay thế ? Tự nhiên trong cái ul#topnav li a bác cho cái display: block là nó tự vô giữa à ? Em không hiểu chỗ này. Em nghĩ thường có 2 cách canh giữa chữ là dùng height = với line-height và text-align: center. Bác giải thích cho em được không ? Thanks bác. Trang web rất hay :D

  8. levishoang says:

    Chú ơi cho con hỏi mấy cái slice hình ở trong video làm sao vậy ah.

  1. BB
  2. BB
  3. BB

arrow

Lưu ý khi post comment:

  • Không "bóc tem" topic
  • Dùng lời lẽ có văn hoá và lịch sự
  • Xem trang FAQs trước khi hỏi
  • Bạn có thể dùng thẻ HTML như:<strong>, <em>, <a>
  • Wrap code trong dấu `backtick` (dấu trên phím Tab)

Chọn kiểu gõ: Tự động TELEX VNI Tắt