cara membuat elemen halaman fungsi scroll

Sangat mudah untuk membuat fungsi scroll halaman,tidak terlalu dibutuhkan program HTML ,dan menurut saya kita hanya perlu membuat sedikit kode untuk memerintahnya dan pastiinisangat gampang,tentunya mempunyai fungsi,dimana fungsi scrool ini adalah untuk menghemat halaman yang mungkin membutuhkan bayak lebar dan tingginya,tapi perlu di ingat bahawqa scroll halaman ini digunakan untuk membuat tempat link,daftar isi dan sebagainya,oke gan giman cara buatnya ,,mari kita ikuti petunjuk yang dibawah ini

pertama masuk ke akun blogger anda

klik rancangan>ELEMEN LAMAN>Tambah Gadget

pilih HTML/javascript

Copy dan paste kode dibawah inididalam konten

<div style="overflow:auto;width: autopx;height:200px;padding:5px;border: 1px solid#000000;margin:4px;padding:2px;"> <style> .list { border-bottom:2px dotted #fff; line-height:1.2em; padding:3px; color: #fffff0; } </style><ul> <div class="list"><a href="http:// alamat link target"> </ul></div></div>

• 1.overflow: fungsinya untuk menggulung halaman apabila sudah melampaui tinggihalaman sepertiyang kita tentukan
• 2.height:200px : adalah tingginya halaman yg akan kita scroll dan agan dapat menggantinya sesuai selera
• 3.width: auto px: adalah lebar halaman yg kita scroll sebaiknya biarkan memakai auto saja
• 4.padding : fungsinya untuk merapatkan tulisan ke dinding halaman yg kita scroll agan juga dapat menggantinya sesuaiselera agan
• 5.border: fungsinya adalah sebagai garis pinggir halaman yg kita scroll

sebagai contoh dapat agan lihat dibwah ini

1.SEO
2.SEARCH ENGINE
3.PAGE RANK
4.YAHOO
5.ENGINE MSN
6.TEMPLATE BLOGGER
7.TRIKDAN TIPS
8.JAVA SCRIPT
9.MEMBUAT CURSOR EFEK
10.MENU KOSONG
11.MENU KOSONG
12.MENU KOSONG
13.MENU KOSONG
14.MENU KOSONG
15.MENU KOSONG
16.MENU KOSONG
17.MENU KOSONG
18.MENU KOSONG
19.MENU KOSONG
20.MENU KOSONG
21.MENU KOSONG

Oke gan gamapang cara buatnya bukan selamat mencoba dan semoga artikel ini dapat membantu..

Read more »

css box shadow

Mari belajarlagi,kali ini kita akan membahas tentang CSS BOX SHADOW .Box shadow ini dapat agan pergunakan untuk mempercantik postingan sobat atau untuk memberikan gaya bayangan di sidebar blog agan,oke gan mari kita coba saja css seperti dibawah ini

joringta

Nah untuk kode css seperti diatas itu adalah seperti ini
#joringta { -moz-box-shadow: 10px 10px 5px #222; -webkit-box-shadow: 10px 10px 5px #222; box-shadow: 10px 10px 5px #222; }

Adapun perintahyang terdapat di dalam CSS BOX SHADOWnya adalah sebagai berikut uraiannya,dan anda dapat memodif lagi agar lebih indah..

Horizontal Offset=Jika nilainya positif maka bayangan akan beradadi sebelah kanan kotak,nah sebaliknya jika nilainya negatif maka bayngan tentu berada di sebelah kiri kotak

Verical ofset=Jika nilainya positif maka bayangannya akan berada di sebelah bawah kotak,dan sebaliknya jika nilainya negatif maka bayangannya berada di sebelah bawah

Blur radius=Jika nilainya nol maka bayangannya seperti biasa,dan jika nilainya ada maka bayangannya akan semakin blur

Warna bayangan=#222 ( #222) bolehagan ganti dengan warna yang lain menurut kebutuhan agan

Oke bro dibawah ini ada beberapa contoh menurut beyangan dari berbagai sudut untuk agan kembangkan lagi

joringta1

untuk kode css diatas adalah
#joringta1{ -moz-box-shadow: -5px -5px #666; -webkit-box-shadow: -5px -5px #666; box-shadow: -5px -5px #666; }

joringta2

untuk kode css diatas adalah
#Contoh_B { -moz-box-shadow: -5px -5px 5px #222; -webkit-box-shadow: -5px -5px 5px #222; box-shadow: -5px -5px 5px #222; }

joringta3

untuk kode css diatas adalah
#joringta3 { -moz-box-shadow: -5px -5px 0 5px #222; -webkit-box-shadow: -5px -5px 0 5px #222; box-shadow: -5px -5px 0 5px #222; }

joringta4

untuk kode css diatas adalah
#joringta4{ -moz-box-shadow: -5px -5px 5px 5px #222; -webkit-box-shadow: -5px -5px 5px 5px #222; box-shadow: -5px -5px 5px 5px #222; }

joringta5

untuk kode css diatas adalah
#joringta5{ -moz-box-shadow: 0 0 5px #222; -webkit-box-shadow: 0 0 5px #222; box-shadow: 0 0 5px #222; }

joringta6

untuk kode css diatas adalah
#joringta6{ -moz-box-shadow: 0 0 5px 5px #000099; -webkit-box-shadow: 0 0 5px 5px #000099; box-shadow: 0 0 5px 5px #000099; }
dan sengaja saya ganti warna biru agar lebih paham..

Oke gan demikianlah sedikit kreasiuntuk css shadow dan agan boleh lebih mengkreasikannya lagi,umpamanya jadikan dia di kotak komentar admin agar berbeda dari yang lain atau di halaman postinganmu,caranya gimana gan,caranya kita bahas dipostingan berikutnya..!!!

Read more »

cara menghilangkan tanda obeng dan tang

Nah untuk melihat lebih gampang dan merasakannya cobalah beli di toko besi..hehheeee..anak kecil juga tahu kok..oke gan mari kita lihat tang dan obeng yang menempel di template blogger kita ini,tapi kenapa ngga kelihatan obengnya bang admin,,ya iyalah kan tang dan obengnya kelihatan saat kita mengedit blog kita maka tang dan obengnya akan nongol,

Read more »

menu tab view

Menu tab view adalah menu yang berbentuk tabel bersusun kebawah yang menunya sesuai dengan tabel menu diatasnya,sistim tabview ini banyuak dipergunakan oleh para blogger untuk mrngurangi pemakain halam blog,cara pemakainnya persis seperti menu horizontal bercabang setiap kita klik tabel menunya maka akan muncul sub menunya oke bro mari kita langsung ke tkp,

Read more »

cara membuat read more manual di blog

Nah untuk postingan kali ini kita akan mengurangi beberapa kalimat didalam tampilan postingan kita ,namun kalimat yang kita kurangi tersebut dalam artian bukan di hilang kan akan tetapi tidak terlihat saat kita menampilkan postigan kita,atau sering disebut dengan kata read more,namun read more yang satu ini kita harus melakukannya secara manual

Oke bro pertama-tama kamu masuk dulu ke akun blogger anda kemudian klik post,nah setelah itu di edit postnya kamu ketik script yang berikut <span class='fullpost'>


</span>

demikianlah sedikit cara memasang scriptnya di edit post,namun sebelum kamu masuk ke dalam edit postnya terlebih dahulu kamu harus memelai tahap-tahap yang dibawah ini

masuk ke akun bloggermu

kemudian save dulu filemu menjaga mana tau terjadi galat dalam pengeditannya

Setelah itu contreng tulisan Expand template widget

Langkah berikutnya kamu cari code seperti ini,namun untuk lebih cepat mencarinya tekan Ctrl +F <p><data:post.body/></p> atau <data:post.body/>

Nah kalau kode tersebut sudah ketemu selanjutnya kamu hapus kodenya dan ganti denagn kode yang dibawah ini

<b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/> <a expr:href='data:post.url'><strong>Baca Selengkapnya...</strong></a></p>

Oke bro setelah kamu ganti kode tadi diatas maka kamu tinggal save dan lihat hasilnya..

Sebagai tipsnya

buat tulisan artikelmu di edit post untuk menampilkan kalimat pertamama sebelum read more kamu tempatkan kalimatmu dibawah kode <span class='fullpost'> dan untuk memotongnya kamu buat artikel kamu dibawah kode </span>

Nah demikianlah sedikit tulisan mengenai read more manual,semoga bermanfaat..

Read more »