Skip to main content

tutorial hover scrollbar

A_large
title:tutorial hover scrollbar
request from:Hanis Sakinah
..........................................................................................
assalamualaikum dan salam sejahtera..hari ini saya nak ajar kawan-kawan buat hover scroll..bagi yang dah tahu sila abaikan..nak tahu macam mana hover scrollbar tu?sila sentuh cursor kawan-kawan di scrollbar saya=).ok dah..jom kita mulakan sesi pembelajaran kita..v(*_*)

1)dashbord>design>edit html
2)search code ]]></b:skin>
3)bila dah jumpa code tu,sila copy code di bawah dan paste atas ]]></b:skin>
::-webkit-scrollbar {
height:12px;
width: 10px;
background-image:url(url bckgrd);
}
::-webkit-scrollbar-thumb {
background-image:url(url bckgrd);
-moz-border-radius: 10px;
border-radius: 10px;
}
::-webkit-scrollbar:hover {
background-image:url(url bckgrd);
}
::-webkit-scrollbar-thumb:hover {
background-image:url(url bckgrd);
-moz-border-radius: 10px;
border-radius: 10px;
}
*url background ada dekat sini atau ambil yang sendiri punya
*background-image:url(url bckgrd)kalo tak mau letak background boleh ubah kepada    background:letakkan kod colour html kawan-kawan..


4)siap!kalo ada problem bagi tahu ye..saya tak marah..=)
hari saya makan banyak sangat..berat badan pun makin naik..huhuhu
creditos:schafieqah yunus 



Comments

Anonymous said…
sye share tutor nie keyh :) nnt sye credit name awk :) thanks !

Popular posts from this blog

freebies background part 4

assalamualaikum w.b.t.. nak bagi background dekat korang nie.. ambik lah jangan tak ambik tapi mesti mau kredit..kalo tak lawa cakap\jadi orang yg jujur/ Flower cute background https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGNLEkawfQDwiUWupO4wP6ft-6tok_8uPgWQW2NaOvvQPzxA3kJR972kDhP4Hl9QRi6x7BDhOOhJL0Gi8gGP-MeaiCjAjojLKzGkJmrDJOFXgRf7fITOCMGOi4WKd_vDUxy5HH8032gDhV/s1600/polkadot-crop.png https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqeiNPZVq1fEczqo8y6HqV_1UAuIGVNYpNrhovIML9GXyEX-fhK5VaT7Rzm7Jrl6WZJM7ll7w95WjYA8NdXjV5iUxs7wdh4197XvOhHBqHu3YFh4gQzk-7IwvwCspJm4Jf4iUM74Rv0A9D/s1600/polkadot-crop+purple.png https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicb9FvTFnNJKXjOqDJ8G-neMypMsN4Cotr7T1coMIZIUOie03jwtMp5k3b6M8RpU9VCHm5byrGWbm59911yZsFh5_GnNGdN0F993kcLm8rKQaBaoLorQjFhMQ3VaQPvK4hj3AgCqnSJ4T0/s1600/polkadot-crop+blue.png https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbpiDdjq_KVHSN0AA7ZiDCT6yjCvXYWcKpIse7Vyv3NuowlhjvkRyKYvriIa4bkSPZ...

TUTORIAL BLOCKQUOTE

nak try tak cantikkan blog dengan kotak corak-corak atau nama komersial BLOCKQUATE.macam kat bawah nie ini kotak blockquate saya..anda nak jugak..mehh saya tunjukkan cara. 1)design>edit HTML 2)cari kod di bawah(untuk memudahkan pencarian tekan ctrl+F) .post-body { 3)dah dapat cari?copy pulak cod dibawah dan pastekan di atas kod post-body{ post blockquote { background-image:url( URL GAMBAR BACKGROUND BLOCKQOUTE ); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 3px   solid #FF0080; margin:1em 20px; } 4) try save kalau menjadi saya ucapkan taniah kalau tak jadi jangan putus asa sebab template yang digunakan tak sesuai dengan coding nie kot.. p/s: red colour tu ikut suka hati nak letak apa..boleh dapat kat  kedai ini credit to: Miss Farah   SELAMAT MENCUBA!!

Freebies:kod bentuk-bentuk border

assalamualaikum... kod bentuk-bentuk border nie boleh digunakan dekat sidebar title,post title,blockquate dan seangkatan dengan nya.. -moz-border-radius-bottomright: 50px; border-bottom-right-radius: 50px; }   -moz-border-radius-bottomright: 50px 25px; border-bottom-right-radius: 50px 25px; } -moz-border-radius-bottomright: 25px 50px; border-bottom-right-radius: 25px 50px; }   -moz-border-radius: 1em 4em 1em 4em; border-radius: 1em 4em 1em 4em; }   -moz-border-radius: 25px 10px / 10px 25px; border-radius: 25px 10px / 10px 25px; } kredit to: putryynasuha