Smooth Scrolling [cuộn mượt] là một trong số những tính năng ẩn trên Google Chrome. Khi bạn sử dụng các trình duyệt khác như Firefox hay Opera, hiệu ứng cuộn chuột khá mượt và không gây khó chịu cho mắt. Trên Google Chrome cũng trang bị cho mình tính năng này, tuy nhiên tính năng này đã bị ẩn.
Trong bài viết dưới đây Quản trị mạng sẽ hướng dẫn bạn cách kích hoạt tính năng này trên Google Chrome.
Để kích hoạt tính năng Smooth Scrolling [cuộn mượt] trên Google Chrome, bạn thực hiện theo các bước dưới đây:
Bước 1:
Mở trình duyệt Google Chrome của bạn sau đó nhập dòng địa chỉ dưới đây vào thanh địa chỉ rồi nhấn Enter:
chrome://flags/#enable-smooth-scrolling
Ngay lập tức bạn sẽ được chuyển hướng đến trang cài đặt liên quan.
Bước 2:
Tại đây bạn tìm cài đặt Smooth Scrolling.
Sau đó click chọn Enable như hình dưới đây:
Bước 3:
Lúc này link text sẽ chuyển từ Enable sang Disable.
Click chọn nút Relaunch Now để khởi động lại trình duyệt của bạn.
Tham khảo thêm một số bài viết dưới đây:
Kích hoạt chế độ duyệt Web không cần kết nối Internet trên Chrome
Thủ thuật cải thiện tốc độ duyệt Web bằng trình duyệt Chrome
5 tiện ích mở rộng trên Chrome giúp bạn lướt Web nhanh hơn
Chúc các bạn thành công!
The scroll-behavior CSS property sets the behavior for a scrolling box when scrolling is triggered by the navigation or CSSOM scrolling APIs. Note that any other scrolls, such as those performed by the user, are not affected by this property. When this property is specified on the root element, it applies to the viewport instead. This property specified on the body element will not propagate to the viewport. User agents are allowed to ignore this property.
scroll-behavior: auto;
scroll-behavior: smooth; scroll-behavior: inherit;
scroll-behavior: initial;
scroll-behavior: revert;
scroll-behavior: unset;
The scroll-behavior property is specified as one of the keyword values listed below. auto The scrolling box scrolls instantly.
The scrolling box scrolls in a smooth fashion using a user-agent-defined timing function over a user-agent-defined period of time. User agents should follow platform conventions, if any.
1 2 3 1 2 3
a { display: inline-block; width: 50px; text-decoration: none; } nav, .scroll-container { display: block; margin: 0 auto; text-align: center; } nav { width: 339px; padding: 5px; border: 1px solid black; } .scroll-container { width: 350px; height: 200px; overflow-y: scroll; scroll-behavior: smooth; } .scroll-page { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 5em; }
| CSS Overflow Module Level 3 # smooth-scrolling |
BCD tables only load in the browser