HỒN VIỆT !


Lập WEB: 21/10/2010

Thống kê

  • truy cập   (chi tiết)
    trong hôm nay
  • lượt xem
    trong hôm nay
  • thành viên
  • Thống kê truy cập

    free counters
    Gốc > Chia sẻ kinh nghiệm > Web - Blog >

    Tùy biến menu hai bên web !!!

    Demo: Hai bên web của VỌC VUI VẺ Không biết ngượng (thanh màu xanh bên trái và màu đỏ bên phải)

     

    Code này Bằng Vũ đã thấy xuất hiện từ lâu trên các diễn đàn và trang riêng Violet nhưng không biết tác giả là ai. 

    Code gốc thì có 2 file .js. Tác dụng: Hiển thị 3 menu trên trang có gắn code: 1 menu bên trái trượt theo trang, 1 menu bên phải đứng im và 1 menu nằm ngang đứng im trên đầu trang.

    Do "cái sự" không thuận tiện của menu bên trái cứ giựt giựt mỗi khi người dùng cuộn trang lên xuống và cái menu ngang phía trên thì che mất 1 phần banner, Bằng Vũ mạo muội xin phép tác giả chỉnh sửa code lại cho thuận tiện và đẹp hơn với các tùy biến về số lượng menu và màu sắc.

     

    Các phần đã tùy biến trong code:

    1) Hai file .js gốc giờ đã được "tích hợp" thành 1 file. (Người dùng chỉ cần kéo 1 link về sử dụng)

    2) Người dùng có thể tùy chỉnh độ rộng, màu sắc chữ và màu nền của từng menu. (Xem ghi chú cuối mỗi dòng có thể chỉnh sửa)

    3) Người dùng có thể cho hiển thị 1 (chỉ bên trái hoặc chỉ bên phải) hoặc cả 2 menu.

    4) Menu cả 2 bên đều "ngoan ngoãn" đứng im khi người dùng cuộn trang lên xuống. Lè lưỡi

    5) Có thể gõ tiếng Việt bằng bảng mã Unicode.

     

    Bước 1: Trước hết, Thầy Cô tải file nguồn về TẠI ĐÂY.

    Bước 2Giải nén file rar >>> "Ta lụm" được file mmBV.js Nháy mắt

    Bước 3:

    - Mở file .js bằng trình soạn thảo văn bản Notepad hoặc Wordpad. Tiếp theo chỉnh sửa các thông số hiển thị menu và màu sắc ưa thích tại các dòng mà Bằng Vũ đã ghi chú cuối mỗi dòng. (Đoạn code đầu file và gần cuối file)

    VD: Đây là đoạn code của menu 1 cần chỉnh sửa trong file .js:

    /***********************************************
    * BẮT ĐẦU THIẾT LẬP MENU 1
    ***********************************************/

    resizereinit=true;
    menu[1] = {
    id:'menu1',
    //////////////////////////////////////////////////////////////////////////
    user_defined_stylesheet:false,
    user_defined_markup:false,
    design_mode:false,
    menutop:20, // Vị trí bắt đầu của menu tính từ trên xuống
    menuspeed:10, // Tốc độ của trình đơn trượt khi mở ra. Số càng nhỏ thì càng nhanh hơn (khoảng thời gian mili giây)
    menupause:100, // Thời gian dừng khi chuột rời khỏi menu. Số càng nhỏ thì càng nhanh hơn (trong mili giây)
    d_colspan:3,
    allowtransparent:false,
    barwidth:15, // Độ rộng khung ngoài menu
    wrapbar:true,
    hdingwidth:210, // Độ rộng bên trong menu
    hdingheight:25, // Chiều cao bên trong menu
    hdingindent:1,
    linkheight:20, // Chiều cao link trong menu
    linktopad:3,
    borderwidth:1, // Độ dày đường viền khung menu
    ////////////////////////////////////////////////////////////////////////////
    bgincolor:'yellow', //Màu nền bên trong menu 1
    bordercolor:'#000080', // Màu khung viền menu 1
    borderstyle:'solid', // Kiểu đường viền khung bên trong (Chon 1 trong 4 kieu: solid (liền nét), dashed (đứt khúc), inset, etc.(không viền))
    outbrdwidth:'0ex 0ex 0ex 0ex',
    outbrdcolor:'white', // Màu viền khung bên ngoài
    outbrdstyle:'etc.', // Kiểu đường viền khung bên ngoài (solid, dashed, inset, etc.)
    barcolor:'white', // Màu chữ bên ngoài menu
    barbgcolor:'red', // Màu nền bên ngoài menu
    barfontweight:'bold', // Độ đậm/nhạt chữ bên trong menu
    baralign:'center', // Căn chỉnh chữ bên NGOÀI menu (Giá trị: left, right hoặc center)
    menufont:'verdana , arial', // Font menu
    fontsize:'90%', // Kích cỡ chữ
    hdingcolor:'yellow', // Màu chữ TIÊU ĐỀ trong menu
    hdingbgcolor:'red', // Màu nền TIÊU ĐỀ trong menu
    hdingfontweight:'bold', // Độ đậm/nhạt chữ TIÊU ĐỀ bên trong menu
    hdingvalign:'middle',
    hdingtxtalign:'center',
    linktxtalign:'left', // Căn chỉnh chữ bên TRONG menu (Giá trị: left, right hoặc center)
    linktarget:'_blank', // Mặc định mục tiêu liên kết sẽ mở, để trống cùng một cửa sổ (Có thể chọn 1 trong các kiểu: _new, _top, or a window or frame name)
    kviewtype:'fixed',

    ///////////////////////////////////////////////////////////////////////


    bartext:'THÀNH VIÊN VIOLET', //TÊN MENU 1 HIỂN THỊ BÊN NGOÀI
    menupos:'right', // TÙY CHỌN VỊ TRÍ MENU TRÊN TRÌNH DUYỆT - left (bên trái) hoặc right(bên phải)
    kviewtype:'fixed',
    menuItems:[

    ["MY FRIENDS !"], // TIÊU ĐỀ BÊN TRONG CỦA MENU 1


    ["01 - Lữ Hồng Ân", "http://luhongan.violet.vn/"],
    ["02 - Lê Văn Bình", "http://lebinh72qn.violet.vn/"],
    ["03 - Vũ Ngọc Hải Bằng", "http://bangvu.violet.vn/"],
    ["04 - Hà Việt Chương", "http://havietchuong.violet.vn/"],
    ["05 - Đặng Thị Kim Dung", "http://dangkimdung55.violet.vn/"],
    ["06 - Trần Thị Thanh Dung", "http://thanhdung65.violet.vn/"],
    ["07 - Đỗ Thanh Dương", "http://thanhduongltv.violet.vn/"],
    ["08 - Đặng Đạm", "http://dangdam36.violet.vn/"],
    ["09 - Nguyễn Văn Hải", "http://hoanglong1997.violet.vn/"],
    ["10 - Trịnh Thu Hằng", "http://thuhangpt77.violet.vn/"],
    ["11 - Vũ Thị Thu Hiếu", "http://giaminh2000.violet.vn/"],
    ["12 - Vũ Như Hoa", "http://hoamtb116.violet.vn/"],
    ["13 - Đỗ Thị Hoa", "http://truonghoa70.violet.vn/"],
    ["14 - Trần Anh Kiệt", "http://ak091261.violet.vn/"],
    ["15 - Nguyễn Thị Phương Lan", "http://phuonglanvmd.violet.vn/"],
    ["16 - Nguyễn Quang Loan", "http://loandc2.violet.vn/"],
    ["17 - Vũ Thị Mai", "http://vuthimai1978.violet.vn/"],
    ["18 - Lê Thị Phương Mai", "http://doquyen46.violet.vn/"],
    ["19 - Nguyễn Mến", "http://nguyenmenlethanhtong.violet.vn/"],
    ["20 - Bình Nguyên", "http://binhnguyenbn.violet.vn/"],
    ["21 - Nguyễn Đức Nhơn", "http://ducnhonthd.violet.vn/"],
    ["22 - Nguyễn Thị Linh Sương", "http://linhsuong2011.violet.vn/"],
    ["23 - Nguyễn Trừ Tâm", "http://tramtuthcs.violet.vn/"],
    ["24 - Đỗ Đức Thiệu", "http://binhbath.violet.vn/"],
    ["25 - Trương Thu Trang", "http://truongthutrang.violet.vn/"],
    ["26 - Nguyễn Thiện Trúc", "http://thientruc63.violet.vn/"],
    ["27 - Lê Hoàng Trung", "http://lehoangtrungct.violet.vn/"],
    ["28 - Nguyễn Thị Tươi", "http://tuoinguyen1955.violet.vn/"],
    ["29 - Phan Nguyễn Tố Uyên", "http://pntouyen01.violet.vn/"],
    ["30 - Tôn Nữ Bích Vân", "http://vantnb.violet.vn/"],

    ]};

    /***********************************************
    * KẾT THÚC THIẾT LẬP MENU 1
    ***********************************************/

     

     Nếu Thầy Cô chỉ cần dùng 1 menu trái hoặc phải thì xóa đoạn code giữa 2 ghi chú dưới đây:

     

    /***********************************************
    * BẮT ĐẦU THIẾT LẬP MENU 1
    ***********************************************/

    ......

    Xóa các code giữa 2 ghi chú này nhá !

    ......

    /***********************************************
    * KẾT THÚC THIẾT LẬP MENU 1
    ***********************************************/

    - Sau đó sửa left hoặc right trong dòng code này: (tìm cái dòng có ghi chú như dưới đây là ra ngay)

    menupos:'right', // TÙY CHỌN VỊ TRÍ MENU TRÊN TRÌNH DUYỆT - left (bên trái) hoặc right(bên phải)

    Bước 4: Lưu file lại và tắt trình soạn thảo đã chỉnh sửa file. 

    Upload file lên host và kéo link về đặt vào "Thông tin bản quyền" bằng đoạn code sau đây: (nhớ thay link của file thành đường dẫn tới file vừa up lên host nhá !)

      <script type="text/javascript" src="link của file"></script>

    LƯU ÝFile .js sẽ không hiển thị trên trình duyệt IE. Để menu hiển thị tốt trên tất cả mọi trình duyệt (dĩ nhiên có cả IE nữa), Thầy Cô áp dụng một mẹo nhỏ như sau:

    - Đổi đuôi file .js thành .swf rồi upload và kéo link file .swf này về.

    Chúc Thầy Cô VỌC VUI VẺ ! Nháy mắt


    DOWNLOAD BÀI VIẾT




    Nhắn tin cho tác giả
    Vũ Ngọc Hải Bằng @ 13:43 10/05/2012
    Số lượt xem: 4327
    Số lượt thích: 0 người
    Avatar

    Tùy biến menu hai bên web - Mại dzô ! Mại dzô ! Cười nhăn răng

    Avatar

    Chào ngày mới! Chúc an lành

    No_avatar

    LÊ THÀNH PHÚC HIỆU TRƯỞNG THCS MINH THÀNH BÌNH PHƯỚC, RẤT VUI NẾU ĐƯỢC GIAO LƯU VỚI CÁC THẦY CÔ TRÊN MỌI MIỀN ĐẤT NƯỚC!

    Avatar

    Cái file .swf này úp lên violet và lấy link về thì menu có chạy được không chú Út, hay à phải dđưa lên host đấy??

    Avatar

    Hay quá chú út à, cái tùy biến cho menu 2 bên web này rất gọn và có thể cho nhiều người chỉnh sửa và quan trọng là có thể up ngay lên Violet (bằng file menu.swf)và lấy link về là OK. Chạy rất ổn định và khỏi sợ host bị die. Cám ơn  chú út nhé!

    Avatar

    - Đổi đuôi file .js thành .swf rồi upload và kéo link file .swf này về.

    Tuyệt nhất là cái kĩ thuật này !
    Còn menu thành viên thì ghi được ít quá...! Có lẽ nên dùng vào việc khác phù hợp hơn thầy Bằng à !
    Avatar

    Đầu bếp cho bài này về "lưu trú" bên VỌC VUI đây ! =))=))

    Avatar

    Hihi, tùy mỗi người dùng cái menu ấy làm gì thôi ạ. E thì thích link các thành viên thân thuộc để tiện...bay qua nhà hàng xóm thăm hỏi cho lẹ í mà. Cười nhăn răng

    Avatar

    Đầu bếp có 2 link này là đi "Ông bỏ vợ, ông bỏ con, ông lấy computer"

    + Sinh nhật thành viên

    + Vọc sinh nhật

    Avatar

    Link thành viên như excel của bác thì quá tuyệt rồi. Em ít thời gian chỉ chạy vòng vòng các nhà thân thiết được thôi ạ. 

     
    Gửi ý kiến