Merhaba Arkadaşlar,
functionalBlocks.js nedir ?
Modern temalarda gördüğünüz gizli (header/sidebar) yapılarını temiz bir şekilde size sunan bir eklenti
functionalBlocks.js nasıl çalışır ?
functionalBlocks.css, functionalBlocks.js dosyalarınızı sayfanıza eklemelisiniz.
|
1 2 |
<link type="text/css" rel="stylesheet" href="library/css/functionalBlocks.css"/> <script src="library/js/functionalBlocks.js"/></script/> |
Html yapımızı sayfanıza ekleyeceksiniz.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<div class="headerBlock"> Header </div> <div class="leftBlock h100"> <div class="headerClone"></div> Left </div> <div class="contentBlock h100"> <div class="headerClone"></div> </div> <div class="rightBlock h100"> <div class="headerClone"></div> Right </div> |
En son adım tetikleme, çalıştırmak için herhangi bir objenin attr’sine onlclick özelliği verim fonksiyonu tanımlayacaksınız
|
1 2 3 |
<button onclick="blockClose( 'leftHidden' );"> Left Open / Close </button> <button onclick="blockClose( 'headerHidden' );"> Header Open / Close </button> <button onclick="blockClose( 'rightHidden' );"> Right Open / Close </button> |
Ön izleme
http://plugins.arabirim.com.tr/functionalBlocks/
İndir
Projeyi github‘dan indirebilirisiz.