Help Sticky navigation xenforo, hiện thanh menu khi kéo chuột lên

lacluoc

Corporal
Tham gia
03/11/2015
Bài viết
146
Được Like
71
Mình thấy nhiều hướng dẫn cố định thanh navigation nhưng thấy cố định mãi rất vướng màn hình. mình muốn hỏi làm thế nào để thanh navigation hiện ra khi KÉO CHUỘT LÊN còn khi kéo xuống thì nó mất. Demo giống trang này http://abvtv.net
Cảm ơn!


nav-gif.13543.html
Demo online style default: http://demo.nhatkythuthuat.com/threads/7/ Sẵn nghe bài nhạc luôn monkey~~
Tempalte: page_container_js_body
Mã:
<!-- Sticky nav by Bcat95-->
<script type="text/javascript">
var lastScrollTop = 0;
$(window).scroll(function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
       $("#navigation").removeClass("sticky");
   } else {
     if ($(window).scrollTop() > <xen:if is="!{$visitor.user_id}">{xen:calc '@headerLogoHeight + @headerTabHeight - 20'}</xen:if><xen:if is="{$visitor.user_id}">{xen:calc '@headerLogoHeight + @headerTabHeight - 20'}</xen:if>) {
        $("#navigation").addClass("sticky");
    } else {
        $("#navigation").removeClass("sticky");
    }
   }
   lastScrollTop = st;
});
</script>
<!-- End sticky nav by Bcat95 -->

Template EXTRA.css
Mã:
#navigation { -webkit-transition: opacity 1s ease; -moz-transition: opacity 1s ease; -ms-transition: opacity 1s ease; -o-transition: opacity 1s ease; transition: opacity 1s ease;}
#navigation.sticky { position:fixed; top:0px; left:0px; right: 0; z-index:7499;}

 
Sửa lần cuối bởi điều hành viên:

dcstylexf

Major
Tham gia
24/03/2015
Bài viết
2,006
Được Like
1,615
Mình thấy nhiều hướng dẫn cố định thanh navigation nhưng thấy cố định mãi rất vướng màn hình. mình muốn hỏi làm thế nào để thanh navigation hiện ra khi KÉO CHUỘT LÊN còn khi kéo xuống thì nó mất. Demo giống trang này http://abvtv.net

Cảm ơn!
chỉ có ở style ui.x :)
 

MacKen

Sergeant
Tham gia
30/11/2015
Bài viết
626
Được Like
543
Mã:
if(uix.stickyNavigationMaxWidth == 0){uix.stickyNavigationMaxWidth = 999999}
if(uix.stickyNavigationMaxHeight == 0){uix.stickyNavigationMaxHeight = 999999}
if(uix.stickyNavigationPortraitMaxWidth == 0){uix.stickyNavigationPortraitMaxWidth = 999999}
if(uix.stickyNavigationPortraitMaxHeight == 0){uix.stickyNavigationPortraitMaxHeight = 999999}
uix.stickyItems['#navigation'] = {normalHeight:parseInt('46'), stickyHeight:parseInt('56')}
var subElement = null;
//if tablinks are visible
uix.stickyItems['#navigation'].options = {subElement: '#navigation .tabLinks', subNormalHeight: parseInt('46'), subStickyHeight: parseInt('56'), subStickyHide: 1 == 1 , scrollSticky: uix.stickyGlobalScrollUp }
 
Sửa lần cuối bởi điều hành viên:

dcstylexf

Major
Tham gia
24/03/2015
Bài viết
2,006
Được Like
1,615
Mã:
if(uix.stickyNavigationMaxWidth == 0){uix.stickyNavigationMaxWidth = 999999}
if(uix.stickyNavigationMaxHeight == 0){uix.stickyNavigationMaxHeight = 999999}
if(uix.stickyNavigationPortraitMaxWidth == 0){uix.stickyNavigationPortraitMaxWidth = 999999}
if(uix.stickyNavigationPortraitMaxHeight == 0){uix.stickyNavigationPortraitMaxHeight = 999999}
uix.stickyItems['#navigation'] = {normalHeight:parseInt('46'), stickyHeight:parseInt('56')}
var subElement = null;
//if tablinks are visible
uix.stickyItems['#navigation'].options = {subElement: '#navigation .tabLinks', subNormalHeight: parseInt('46'), subStickyHeight: parseInt('56'), subStickyHide: 1 == 1 , scrollSticky: uix.stickyGlobalScrollUp }
cái này chỉ là phần nổi, còn các biến ui.x thì nó nén hết lại rồi :D
 

dcstylexf

Major
Tham gia
24/03/2015
Bài viết
2,006
Được Like
1,615
Ý bạn chủ thớt là khi kéo scroll lên thì nó hiện ra, kéo xuống thì nó k hiện. Còn demo này kéo xuống mình thấy nó vẫn hiện mà :)
kéo xuống ko hiện, chỉ kéo lên mới hiện mà bạn?
Mình vừa xem demo xong?
 

f0rest

MasterCorporal
Tham gia
22/04/2015
Bài viết
309
Được Like
198
kéo xuống ko hiện, chỉ kéo lên mới hiện mà bạn?
Mình vừa xem demo xong?
Bạn xem lại demo của chủ thớt đưa, ở đây kéo cái page đi lên thì nó k hiện ra, kéo cái page đi xuống thì nó sẽ hiện ra bạn ơi!
Link demo của bạn @bcat95 thì kéo page lên thì nav hiện ra và ngược lại.
 

dcstylexf

Major
Tham gia
24/03/2015
Bài viết
2,006
Được Like
1,615
Nếu mấy bác thấy style k phải style xen mặc định là lúc đấy đang dev style khác chứ k phải style demo :)
Demo online style default mình đã ghi rõ ở đây rồi. Vì site dùng để test nên k cố định style khi vào web :D headbang~~
chắc bác ấy quên rofl~~
 

f0rest

MasterCorporal
Tham gia
22/04/2015
Bài viết
309
Được Like
198
oh yeah! kéo dài ra đc rồi :))
 
  • Like
Reactions: THB

lacluoc

Corporal
Tham gia
03/11/2015
Bài viết
146
Được Like
71
TRong suốt do style bạn đang dùng. Ntn thì cậu biết rồi chứ.
Còn mình demo trên mặc định xen.
Lạ nhỉ, mình dùng ở trên navigation nó màu xanh, nhưng kéo xuống để dùng cái của cậu thì nó lại trong suốt
 

lacluoc

Corporal
Tham gia
03/11/2015
Bài viết
146
Được Like
71
Thanks
Cái này dành riêng cho style bác đnag dùng
Mã:
<!-- Sticky nav by Bcat95-->
<script type="text/javascript">
var lastScrollTop = 0;
$(window).scroll(function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
       $("#navigation").removeClass("sticky");
   } else {
     if ($(window).scrollTop() > <xen:if is="!{$visitor.user_id}">{xen:calc '@headerLogoHeight + @headerTabHeight - 20'}</xen:if><xen:if is="{$visitor.user_id}">{xen:calc '@headerLogoHeight + @headerTabHeight - 20'}</xen:if>) {
        $("#header").addClass("sticky");
    } else {
        $("#header").removeClass("sticky");
    }
   }
   lastScrollTop = st;
});
</script>
<!-- End sticky nav by Bcat95 -->

Mã:
#header{ -webkit-transition: opacity 1s ease; -moz-transition: opacity 1s ease; -ms-transition: opacity 1s ease; -o-transition: opacity 1s ease; transition: opacity 1s ease;}
#header.sticky{
    position: fixed !important;
    top: 0px;
    left: 0px;
    right: 0;
    z-index: 7499;
}
kéo xuống nó ko tự ẩn cậu ạ, nó chỉ tự ẩn khi kéo lần đầu, nếu load trang kéo lần 1 thì ok nó ẩn, nhưng sau đó kéo tiếp lần 3 thì nó thành hiện cố định luôn
 

dakhucquan.net

MasterCorporal
Tham gia
27/06/2015
Bài viết
336
Được Like
151
hic, khổ cái đang làm trên localhost ko nhờ bác giúp hộ e tí
 

dakhucquan.net

MasterCorporal
Tham gia
27/06/2015
Bài viết
336
Được Like
151
mò hoài không ra bác ạ, css thấy vẩn chạy nhưng trình vẩn gà nên không biết xoay xở thế nào!
demo: pistudio.vn
e inbox bác acc admin rồi nhờ bác coi hộ e tí, sửa những chổ nào ghi chú lại hộ e tẹo để e tập ngâm cứu nha bác! cám ơn bác nhiều!
 

dinhhai

MasterCorporal
Tham gia
28/07/2015
Bài viết
399
Được Like
198
Bác @bcat95 ơi, mình làm theo mà nó lúc kéo xuống thì nó cũng cố định luôn, bạn xem giúp mình nhé. Site mình vnaccounting.net

Mình muốn khi kéo lên là cố định luôn cả logo nha bác

Cảm ơn bác
 
Người đăng Chủ đề tương tự Diễn đàn Trả lời Ngày đăng
X Styles Xenforo 0
phungprotv Styles Xenforo 3
d2agon Styles Xenforo 7

Chủ đề tương tự


Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom