أبو سري

Content

التسميات: إضافات بلوجر

اضافةاوتغيير شريط الازاحة او Scroll-Bar بعدة اشكال مختلفة

يمكنك الان تغيير Scroll-Bar فى بلوجر وتغييرة لاضافة لمسة جميلة الى موقعك حيث

تغيير واختيار ما ترغب فية من اضافات ذات الوان واشكال متنوعة لتضيف افضل الالوان

لاستكمال المنظر الجميل للمدونة .. قم بتجربتها اولا ستعجبك جدا

- قم بالتوجه الى بلوجر > القالب > تعديل القالب > ابحث عن الوسوم التالى

]]></b:skin>

قبل هذا الوسوم قم باضافة الكود التالى

Scroll-Bar الاول :

::-webkit-scrollbar { height:12px; width: 12px; background:#646060; } ::-webkit-scrollbar-thumb { background-color: lightgray; }

Scroll-Bar الثانى :

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255,0,0,0.8);
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,0.4);
}

Scroll-Bar الثالث :

::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #F5F5F5;
border-radius: 10px;
}
::-webkit-scrollbar
{
width: 10px;
background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb
{
background-color: #AAA;
border-radius: 10px;
background-image: -webkit-linear-gradient(90deg,
                                           rgba(0, 0, 0, .2) 25%,
             transparent 25%,
             transparent 50%,
             rgba(0, 0, 0, .2) 50%,
             rgba(0, 0, 0, .2) 75%,
             transparent 75%,
             transparent)
}

Scroll-Bar الرابع :

     ::-webkit-scrollbar {
        width: 10px;
    }
    ::-webkit-scrollbar-track {
        background: #FFF;
        -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);
    }
    ::-webkit-scrollbar-thumb {
        background: #CCC;
        -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.2);
    }
    ::-webkit-scrollbar-thumb:hover {
        background: #AAA;
    }
    ::-webkit-scrollbar-thumb:active {
        background: #888;
        -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);
    }

Scroll-Bar الخامس :

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}