Hide Footer Widget Slide Toggle Effect

Hide Footer Widget Dengan Slide Toggle - Mungkin ini bisa dikatakan sebagai kelanjutan efek toggle animasi jquery ui dengan konsep blog gaya metro ui style, namun ini skaligus sebagai jawaban dari sahabat Ubay Nyzhar yang nanyain cara membuat footer seperti blog ini.
Fungsi dari slide toggle ini adalah untuk menyembunyikan element agar halaman lebih ringkas dengan bantuan Jquery.

Untuk cara pemasangan di blog sebagai berikut :

JQUERY

Code:

<script type='text/javascript' src='jquery-1.10.2.min.js'></script>

CSS

Code:

#show-button{padding:0;background:#555;color:#3498db;cursor:pointer;display:inline-block}
#show-widget{display:none;text-align:left;background:#555;color:#fff;padding:0}

HTML & JS

Code:

<script type='text/javascript'>$(document).ready(function(){$("#show-button").click(function(){$("#show-widget").slideToggle()})});</script>
<div id='show-button'>TOMBOL SHOW/HIDE</div>
<div id='show-widget'> WIDGET YANG AKAN DISEMBUNYIKAN</div>

Letakkan HTML & JS dibawah kode

Code:

#footer-widgets

atau

Code:

#footer-wrapper

atau yang mirip mirip saja karena setiap template bisa saja berbeda, kemudian tutup kode dengan

Code:

</div>

SOURCE

 

berfungsi juga gk ini untuk

berfungsi juga gk ini untuk wordpress?

 

Ini saya lakukan di blogspot.

Ini saya lakukan di blogspot...kurang tau kalau pakai wpress bisa jalan ato ga

 

ijin nyimak saja.

ijin nyimak saja.

 

ayahnyanadia wrote:

Ini nih, komentar ayahnyanadia. Serasa gimana gitu

 

D-dig wrote:

daripada ijin ke belakang, hayo, kan mendingan ijin nyimak, ntar abis gitu ijin kopas

 

Bagus tuh, apa cuman work di

Bagus tuh, apa cuman work di Blogger doank?

 

saya agak menghindari ni

saya agak menghindari ni dengan jquery atau JS, karena menurut saya bisa memperlambat blog