Wednesday, January 18, 2023

Dân Chơi

Tạo button slider flatsome đẹp

một số anh em nghi vấn về cái button slider tạo điểm nổi bật xíu cho slider trong theme flatsome nhàm chán trước giờ , ok hôm nay tớ chia sẽ phương pháp khiến nhé

Tạo button slider flatsome đẹp

Để dễ tưởng tượng bạn xem qua hình mình đã khiến Dự án

Tạo button slider flatsome đẹp

Tạo button slider flatsome đẹp

một điểm nổi bật kì dị so có Slider của Flatsome đúng không nào , nếu như bạn muốn xem thực tại bạn với thể xem qua demo tại đây https://farm.chowebs.com

cách thức làm cho button slider flatsome đẹp

bạn chỉ cần đặt css nào vào css custom là xong nhé

.flickity-prev-next-button.previous 
left: 90%;

.flickity-prev-next-button 
opacity: 1;

.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button 
margin-top: -43%;

.slider-nav-circle .flickity-prev-next-button svg 
border: 0;
border-radius: 100%;
background-color: #9a1b1f;
border-radius: 0;
color: white;

Bạn với thể chỉnh các tham số left: 90%margin-top: -43% cho phù hợp mang width của slider của bạn

Bạn cũng sở hữu thể đặt slider của bạn trong một table nhớ đặt class cho table nhé ( thí dụ tớ đặt class cho table là .sanpham là ta sở hữu thể code css dạng sau )

.sanpham .flickity-prev-next-button.previous 
left: 90%;

.sanpham .flickity-prev-next-button 
opacity: 1;

.sanpham .slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button 
margin-top: -43%;

.sanpham .slider-nav-circle .flickity-prev-next-button svg 
border: 0;
border-radius: 100%;
background-color: #9a1b1f;
border-radius: 0;
color: white;

Bạn chỉ cần lưu lại là xong

Chúc bạn thành công

theo : https://flatsome.xyz/tao-button-slider-flatsome-dep.html