Custome gulir bar dengan WebKit CSS - Tutorial Membuat web ucoz - Book - Software - SMKN 1 Gambut
Sabtu, 2016-12-03, 01:03:29
Welcome Guest | RSS

ŠӍҚЙ 1 ǤǺӍBƯҬ™
Software, Artikel, Forum, Photo, Social Network, Education, Iklan, Video, Berita, Blog.
E-Mail

Site menu
Section categories
Iklan
Iklan

Software

Main » Ad Board » Book » Tutorial Membuat web ucoz

Custome gulir bar dengan WebKit CSS
Sharing | 2012-07-03, 10:25:56
Sekarang SMKN 1 Gambut berbagi Tutorial ini akan menunjukkan kepada Anda bagaimana memodifikasi scroll bar browser default, untuk sesuai dengan website Anda.


Step 1 :
Sebelum Anda melanjutkan, perhatikan bahwa ini hanya akan bekerja di Google Chrome dan browser Safari sejauh ini.


 Pergi ke Control Panel -> klik pada menu "Design" -> klik pada "Desain Manajement CSS"

 
Step 2 :
Memodifikasi kode struktur dan kemudian paste pada CSS Anda.
::-webkit-scrollbar-button {background-image:url(BACKGROUND GAMBAR ANDA );background-repat:no-repeat;width:12px;height:18px}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color:#000;}
::-webkit-scrollbar-thumb {-webkit-border-radius: 10px; border-radius: 10px;background-color:#006699;}
::-webkit-scrollbar-thumb:hover{background-color:#008BCE;}
::-webkit-resizer{background-image:url( RESIZER'S BACKGROUND.png);background-repeat:no-repeat;width:12px;height:18px}
::-webkit-scrollbar{width: 12px;}

Penjelasan:


1 ::-webkit-scrollbar-button untuk tombol panah.
2 ::-webkit-scrollbar-thumb adalah untuk bar

3 ::-webkit-scrollbar-track adalah untuk latar belakang scroll bar, yang hitam di default tetapi Anda dapat mengubah warna dengan mengganti # 000000 atau dengan kata "white" oleh setiap warna HEX

4 ::-webkit-resizer untuk Textarea resizer


5 ::-webkit-scrollbar adalah untuk lebar scroll bar.

Lain Serikat:

 Ini adalah beberapa negara lain.

 
:hover
:horizontal
:vertical
:decrement
:increment
:start
:end
:double-button
:single-button
:no-button
:corner-present
:window-inactive

Anda dapat menentukan satu sebagai contoh berikut:

::-webkit-scrollbar-thumb:hover{css-style- Kamu}
                       =====================================
=====================================


Langkah 3:
  Klik save dan kemudian memeriksa situs Web Anda mengedipkan

===================================== =====================================
Alternatif methd untuk menerapkan pengaturan:


Jika Anda menggunakan desain default UcoZ dan Anda punya masalah, cobalah untuk menggunakan metode ini

 Pertama Anda harus mengupload file ini dari file manager Anda, ke folder css [menciptakannya jika tidak ada]
 [Klik kanan dan pilih "save link as ..."] 

Pergi ke control panel -> Design -> Quick substitution of template parts -> beralih ke Multi-Line Replacement Method.

dalam  "Find" cari, enter

Code
</head>

dan dalam "Ganti dengan", masukkan
Code
<style type="text/css">
@import url("$HOME_PAGE_LINK$/css/scrollbars.css");
</style>
</head>


=====================================
Berikut adalah contoh code di website:

Code
::-webkit-scrollbar-button {background-image:url(http://darkionsblog.com/images/scrollbarbutton.png);background-repat:no-repeat;width:12px;height:18px}
::-webkit-scrollbar{width: 12px;}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color:#000;}
::-webkit-scrollbar-thumb {-webkit-border-radius: 10px; border-radius: 10px;background-color:#006699;}
::-webkit-scrollbar-thumb:hover{background-color:#008BCE;-webkit-transition: all .3s ease-in-out;}
::-webkit-scrollbar-corner, ::-webkit-resizer{background-image:url(http://darkionsblog.com/images/scrollbarbutton.png);background-repeat:no-repeat;width:12px;height:18px}


Selesai....

SELAMAT MENCOBA, SEMOGA SUKSES...



Bila Terjadi kesalahan atau link Download sudah Mati, anda Bisa Hub :
: sicklon@gmail.com : Sicklon Kz : @Sicklon_kz Atau Komentar, untuk Merepair Secepatnya
Added by: sicklon |
Views: 533 | Placed till: 2012-08-03 | Rating: 0.0/0 | |
Total comments: 0
Only registered users can add comments.
[ Registration | Login ]
Libur Puasa 2012

Pencarian :

Iklan
Wasiat Guru Sekumpul
1. Menghormati Ulama.
2. Baik Sangka Terhadap Muslimin.
3. Murah diri.
4. Manis Harta.
5. Manis Muka.
6. Jangan Menyakiti Orang.
7. Memaafkan Kesalahan Orang.
8. Jangan Bermusuh-musuhan.
9. Jangan Thoma.
10. Berpegang Kepada Allah Ta’ala kabul segala hajat.
11. Yakin Keselamatan itu ada pada yang benar.
12. Jangan merasa baik dari pada orang lain.
13. Tiap-tiap orang iri, dengki atau adu asah jangan dilayani serahkan saja pada Allah Ta’ala.
Statistics

Total online: 1
Guests: 1
Users: 0
Iklan
TibiaME - Kz

Copyright MyCorp SMK Negeri 1 Gambut © 2011 - 2016



/font>