Jump to content

How to change the shape of the scroll??


Recommended Posts

Hello
I want to change and beautify the IPS scrolls
Thank you for your guidance
I saw an example, if we can implement a plan like this, it would be great

https://onaircode.com/html-css-custom-scrollbar-examples/

Link to comment
Share on other sites

Все это, конечно, прикольно. Но работает далеко не во всех браузерах.

А задача матёрого владельца сайта в том, чтобы добиться работоспособности во всех основных браузерах.

Link to comment
Share on other sites

3 hours ago, afshin20 said:

این رو به css  اضافه کن 
 

:root {
 scrollbar-color:#000 !important;
 scrollbar-width:thin !important;
 border-radius:1ex;
}

 

it did not work

Link to comment
Share on other sites

-webkit-scrollbar будет работать во всех основных браузерах с поддержкой webkit
Пример:

::-webkit-scrollbar {
    width: 10px;
    background: #2a6a81;
}
::-webkit-scrollbar-thumb {
    background: #ebeff3;
    border-radius: 2px;
}
Спойлер

image.thumb.png.c4cdc367078fee6a862d4066327917f7.png

 

Link to comment
Share on other sites

2 hours ago, Exception said:

-webkit-scrollbar будет работать во всех основных браузерах с поддержкой webkit
Пример:

::-webkit-scrollbar {
    width: 10px;
    background: #2a6a81;
}
::-webkit-scrollbar-thumb {
    background: #ebeff3;
    border-radius: 2px;
}
  Hide contents

image.thumb.png.c4cdc367078fee6a862d4066327917f7.png

 

thank you
I also put this code in custom.css, but it didn't work

scr.jpg.22e56fdd20f39680067203cdc9470963.jpg

Link to comment
Share on other sites

::-webkit-scrollbar {
    width: 10px;
    background: #2a6a81;
}
::-webkit-scrollbar-thumb {
    background: #ebeff3;
    border-radius: 2px;
}

 اگر از مرورگر فایرفاکس استفاده میکنی این کد ساپورتش نمیکنه
ولی برای سایر مرورگر ها مثل کروم، و غیره ساپورت میکنه 
راه دیگه ایم نداره تلاش نکن
webkit no support firefox

Edited by afshin20
Link to comment
Share on other sites

2 часа назад, avangcom сказал:

I want it to work in all browsers, especially Firefox

а сразу не написать? Для всех и сразу скорее всего не получится. Вот ответ - https://stackoverflow.com/questions/6165472/custom-css-scrollbar-for-firefox
смотри, изучай, пробуй

Link to comment
Share on other sites

tested Ok

html {   /* For Firefox */   overflow-y: scroll;   scrollbar-color: #008de4 #0d3b97;   scrollbar-width: thin; }  /* For Chrome and other browsers except Firefox */ body::-webkit-scrollbar {     width: 0.5em;     background-color: #0d3b97; } body::-webkit-scrollbar-thumb {     background-color: #008de4; }

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Ваша ссылка была автоматически строена.   Отображать как обычную ссылку

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...