Cara Mudah Mempercantik Tooltips dengan Bootstrap dan JQuery

Setelah kemarin membahas tentang penerapan bootstrap di navigasi paging, kini saya akan membahas tentang bagaimana cara membuat tooltips keren dengan sangat mudah menggunakan kombinasi bootstrap dan jQuery. Bootstrap lagi.. bootstrap lagi… iya maklum, soalnya saya lagi demen nih bootstrap karena terus terang saya gak punya jiwa seni dan desain web. Untungnya ada bootstrap sehingga saya tidak perlu pusing pusing bikin style css nya. Cukup gunakan yang sudah ada saja.

Oya, apa itu tooltips? tooltips adalah informasi yang muncul ketika mouse dikenakan pada suatu obyek. Perhatikan contoh tooltips berikut ini

 photo tooltips01_zpsea4cca2e.jpg

OK dah paham ya apa itu tooltips. Selanjutnya dalam artikel ini kita akan memodifikasi tampilan tooltips tersebut supaya lebih cantik menggunakan Bootstrap dan jQuery. Ini dia tampilan yang diharapkan…

 photo tooltips02_zps565e9440.jpg

Continue reading “Cara Mudah Mempercantik Tooltips dengan Bootstrap dan JQuery”

Mempercantik Navigasi Paging dengan Twitter Bootstrap

Beberapa waktu yang lalu, saya pernah memaparkan tentang bagaimana membuat script PHP untuk keperluan paging. Jika diperhatikan, link navigasi perhalaman yang dihasilkan dari script tersebut masih sangat sederhana sekali. Perhatikan gambar berikut ini

 photo twitter-bootstrap01_zpsa29c4847.jpg

Nah.. dalam artikel ini kita akan sedikit memoles tampilan navigasinya tersebut supaya lebih cantik menggunakan Twitter Bootstrap. Apa itu Twitter Bootstrap? Twitter Bootstrap adalah framework CSS yang dikembangkan oleh Twitter. Dengan framework CSS yang siap ini kita tidak perlu pusing-pusing memikirkan atau membuat style CSS nya. Adapun hasil akhir dari tampilan navigasinya nanti adalah seperti ini

 photo twitter-bootstrap02_zpsde13f801.jpg

Mau tau cara membuatnya? OK mudah kok ternyata.

Continue reading “Mempercantik Navigasi Paging dengan Twitter Bootstrap”