Hỏi Nhờ hướng dẫn chèn logo vào menu website

Thành viên năng động
HIHIHIHI.
Thế thì đâu chỉ là cái menu. Khổ tâm quá :(
hihi có lẽ do bác chủ thớt chưa trình bày gãy gọn. Theo e hiểu thì ý bác thớt là như thế :)
@anhyeuviolet bác nghiên cứu làm được thì hướng dẫn em với nhé. Thanks bác trước :)
 
Thích: anhyeuviolet
Thành viên quá tích cực
Quản trị viên
Hướng dẫn sử dụng cho block menu bác @anhyeuviolet vừa up bên trên:
1. Logo các bác đặt trong div có chứa id "logo" như sau:
HTML:
<div id="logo" style="display:none;"></div>
2. Tiếp theo thêm đoạn js này vào ngay bên dưới hoặc trong file footer-only.tpl (trước thẻ /body). Thay đổi chiều cao 920 cho phù hợp.
JavaScript:
var pastWaypoint = false;
$(window).scroll(function(){
    if ($(window).scrollTop() > 920 && !pastWaypoint) {
        $('#logo').show();
        $('#main-nav').css('top','0px');
        console.log('d');
        pastWaypoint = true;
    }
    else if ($(window).scrollTop() <= 920 && pastWaypoint)
    {
         $('#logo').hide();
        console.log('f');
         $('#main-nav').css('top','100px');
        pastWaypoint = false;
    }
});
3. Thêm hoặc bổ xung thuộc tính này vào id logo trong style.css
#logo {
position:fixed;
background:blue;
}
 
Thích: anhyeuviolet
Thành viên năng động
Cám ơn bác @khoanglang12 e đã làm được. demo trungkien.com.vn :) thanks các bác :)
 
Thích: anhyeuviolet
Thành viên năng động
Còn phần đổi màu menu....?

13.png
 
Thích: deetranit2
Thành viên năng động
Còn phần đổi màu menu....?

View attachment 1982
phần đổi màu ở trang trước có bác hướng dẫn rồi đó, e chưa làm theo cái đó nhưng bác thử xem thế nào :)
 
Thành viên mới
xin hỏi các bác bước 1 này làm ntn ạ
Hướng dẫn sử dụng cho block menu bác @anhyeuviolet vừa up bên trên:
1. Logo các bác đặt trong div có chứa id "logo" như sau:
HTML:
<div id="logo" style="display:none;"></div>
2. Tiếp theo thêm đoạn js này vào ngay bên dưới hoặc trong file footer-only.tpl (trước thẻ /body). Thay đổi chiều cao 920 cho phù hợp.
JavaScript:
var pastWaypoint = false;
$(window).scroll(function(){
if ($(window).scrollTop() > 920 && !pastWaypoint) {
$('#logo').show();
$('#main-nav').css('top','0px');
console.log('d');
pastWaypoint = true;
}
else if ($(window).scrollTop() <= 920 && pastWaypoint)
{
$('#logo').hide();
console.log('f');
$('#main-nav').css('top','100px');
pastWaypoint = false;
}
});
3. Thêm hoặc bổ xung thuộc tính này vào id logo trong style.css
#logo {
position:fixed;
background:blue;
}