Tạo nút Scroll to Top khi cuộn trang xuống dưới

Discussion in 'Template Modifications' started by Blue, Dec 9, 2015.

  1. Blue

    Blue Admin - Founder Staff Member

    Joined:
    Feb 25, 2015
    Messages:
    796
    Likes Received:
    1,246
    Trophy Points:
    93
    Gender:
    Male
    Khi bạn đọc một bài viết dài sẽ rất mất thời gian khi muốn cuộn về menu ở header của trang, rất nhiều website đã tạo 1 nút gọi là scroll to top hoặc back to top nằm ở góc phải giao diện. Khi nhấn vào nút này sẽ giúp bạn trở về header trang ngay lập tức.

    tao nut scroll to top khi cuon trang xuong duoi.png
    Hình minh họa

    Để thực hiện điều này các bạn chỉ cần vào style đang sử dụng, gắn đoạn code bên dưới vào cuối (nằm trên thẻ
) template footer

Code:

 
Bài viết mới
Last edited: Jan 18, 2016
Blue, Dec 9, 2015
#1
boygacf, nobita8x, TD2308 and 5 others like this.
  • cuonghv

    cuonghv Cộng Sự Đắc Lực Staff Member

    Joined:
    Aug 15, 2015
    Messages:
    388
    Likes Received:
    354
    Trophy Points:
    63
    Gender:
    Male
    Location:
    4r truyện kiếm hiệp
    Home Page:
    Áp dụng ngay và luôn. Tìm kiếm mãi mà không có cái nào vừa ý!
    Thank nhóa!
     
    THB likes this.
  • 2L.Ohayo

    2L.Ohayo Cộng Sự Đắc Lực Staff Member

    Joined:
    Mar 8, 2015
    Messages:
    761
    Likes Received:
    808
    Trophy Points:
    93
    Gender:
    Male
    cho em xin luôn đoạn script go to bottom với ạ.
     
    THB likes this.
  • PVS

    PVS Cộng Sự Đặc Biệt Staff Member

    Joined:
    Feb 28, 2015
    Messages:
    11,779
    Likes Received:
    7,039
    Trophy Points:
    113
    Gender:
    Male
    Location:
    Huế
    Home Page:
    em cần cái này lâu lắm òy ^^ hii
     
  • Blue

    Blue Admin - Founder Staff Member

    Joined:
    Feb 25, 2015
    Messages:
    796
    Likes Received:
    1,246
    Trophy Points:
    93
    Gender:
    Male
    troll anh à, đoạn đó để làm gì :v
     
    THB likes this.
  • chanhnghiem

    chanhnghiem Thượng Đế

    Joined:
    Oct 10, 2015
    Messages:
    154
    Likes Received:
    89
    Trophy Points:
    28
    em bị lỗi admin ơi upload_2016-1-17_16-37-54.png
     
  • Blue

    Blue Admin - Founder Staff Member

    Joined:
    Feb 25, 2015
    Messages:
    796
    Likes Received:
    1,246
    Trophy Points:
    93
    Gender:
    Male
    Bạn kiểm tra kỹ lại xem giống hoàn toàn đoạn mình viết chưa nhé, thiếu nên thế đó.
     
    THB likes this.
  • chanhnghiem

    chanhnghiem Thượng Đế

    Joined:
    Oct 10, 2015
    Messages:
    154
    Likes Received:
    89
    Trophy Points:
    28
    em copy 2 lần vẫn vậy anh. em có lấy từ style a share nó có totop nhưng vẫn lỗi đó
    Code:
    
    
     
  • dev.xf

    dev.xf Thượng Đế

    Joined:
    Feb 28, 2015
    Messages:
    449
    Likes Received:
    499
    Trophy Points:
    93
    Gender:
    Male
    Occupation:
    Coder - Xenforo Developer
    Location:
    Phan Thiết - Bình Thuận
    Home Page:
    THB and 2L.Ohayo like this.
  • chanhnghiem

    chanhnghiem Thượng Đế

    Joined:
    Oct 10, 2015
    Messages:
    154
    Likes Received:
    89
    Trophy Points:
    28
  • dev.xf

    dev.xf Thượng Đế

    Joined:
    Feb 28, 2015
    Messages:
    449
    Likes Received:
    499
    Trophy Points:
    93
    Gender:
    Male
    Occupation:
    Coder - Xenforo Developer
    Location:
    Phan Thiết - Bình Thuận
    Home Page:
    inbox mình nick admin diễn đàn bạn mình giải quyết cho nha
     
  • dev.xf

    dev.xf Thượng Đế

    Joined:
    Feb 28, 2015
    Messages:
    449
    Likes Received:
    499
    Trophy Points:
    93
    Gender:
    Male
    Occupation:
    Coder - Xenforo Developer
    Location:
    Phan Thiết - Bình Thuận
    Home Page:
    asdf.gif
     
  • 2L.Ohayo

    2L.Ohayo Cộng Sự Đắc Lực Staff Member

    Joined:
    Mar 8, 2015
    Messages:
    761
    Likes Received:
    808
    Trophy Points:
    93
    Gender:
    Male
  • agrione

    agrione Thượng Đế

    Joined:
    Sep 7, 2015
    Messages:
    120
    Likes Received:
    94
    Trophy Points:
    28
    Gender:
    Male
    Xây dựng đến mức đó mà bỏ thì ko phải quá uổng sao
    Test cái chủ top phát
     
  • dev.xf

    dev.xf Thượng Đế

    Joined:
    Feb 28, 2015
    Messages:
    449
    Likes Received:
    499
    Trophy Points:
    93
    Gender:
    Male
    Occupation:
    Coder - Xenforo Developer
    Location:
    Phan Thiết - Bình Thuận
    Home Page:
    đợt đó anh đi trung quốc nên không có a online dc eà
     
  • Blue

    Blue Admin - Founder Staff Member

    Joined:
    Feb 25, 2015
    Messages:
    796
    Likes Received:
    1,246
    Trophy Points:
    93
    Gender:
    Male
    Vẫn lỗi là do style của bạn rồi, khu vực chép mã css vào phải nằm trên thẻ nhé
     
  • dinhhai

    dinhhai Thượng Đế

    Joined:
    Jul 28, 2015
    Messages:
    393
    Likes Received:
    196
    Trophy Points:
    43
    Gender:
    Male
    Location:
    hcm
    Cảm ơn bác @Blue
    Đúng thứ đang cần :D
     
    THB likes this.
  • Chiennd1810

    Chiennd1810 Thượng Đế

    Joined:
    Apr 16, 2016
    Messages:
    22
    Likes Received:
    10
    Trophy Points:
    3
    Gender:
    Male
    Location:
    Hà Nội
    Home Page:
    Em dùng Xen 1.5.7 style Nitrogen
    tìm trong template footer không thấy có thẻ
    các bạn giúp em với |(

    Code:
    
    
    
    
    
    
    {xen:phrase timing}:
    {xen:phrase x_seconds, 'time={xen:number $page_time, 4}'}
    {xen:phrase memory}:
    {xen:phrase x_mb, 'size={xen:number {xen:calc "{$memory_usage} / 1024 / 1024"}, 3}'}
    {xen:phrase db_queries}:
    {xen:number {$db_queries}}
     
    THB likes this.
  • Vien

    Vien Thượng Đế

    Joined:
    Jun 7, 2016
    Messages:
    2
    Likes Received:
    5
    Trophy Points:
    3
    Gender:
    Male

    Không có thì cứ nhét vào cuối cùng nhé!
     
    THB and Chiennd1810 like this.
  • tuna

    tuna Thượng Đế

    Joined:
    Jan 30, 2017
    Messages:
    641
    Likes Received:
    246
    Trophy Points:
    43
    Gender:
    Male
    em làm theo nhưng chỉ tới cuối trang thì mới bấm đc nút, có cách nào ở giữa trang vẫn back to top đc giống vnxf ko ạ
     
  • Tags:

    Share This Page

    XenForo Add-ons by Brivium ™ © 2012-2013 Brivium LLC.