Javascript Framework - em desenvolvimento.
##Como usar
bower install warjs
Adicione o arquivo warjs em seu projeto
<script src="js/warjs.min..js"></script>
inicie a variavel e o metodo mount();
var war;
$(document).ready(function () {
war = new warjs();
war.mount();
});
Principais funcionalidades
data-war-shot="{point:'self',name:'animate',limit:'50',delay:'1000'}"
<div class="form animated hideEl " data-war-shot="{point:'self',type:{addClass:'zoomInUp',removeClass:'hideEl'},limit:'$screenHeight/3'}">
<header class=" menu" data-war-shot="{point:'50', type:'pin', name:'active'}">
- point - numero referente a rolagem ou use self para pegar o top do elemento
- limit - numero que vai
- delay - tempo de espera para executar a ação
- name - o nome da class ou função
- type - pin, addClass, removeClass, function ou Objeto {addClass:'class',removeClass:'class',function:'Function_name'}
<a href="#" data-war-menu="{target:'#quemsomos',limit:100,limitMove:100}">Quem Somos</a>
- class - class adicionada no modo ativo
- target - elemento a ser alcançado
- limit - limit para o target (target - limit)
- limitMove - valor a ser adicionado no scrollmove
<section class="page home" data-war-size="{height:'$screenHeight',limitH:'600'}">
</section>
- height - altura do elemento / podemos utilizar variaveis
- width - largura do elemento / podemos utilizar variaveis
- limitH - tamanho minimo do elemento
- limitW - tamanho minimo do elemento
data-war="{ toplimit:'true', animate:['background-position-y',[0,100],['0','30'],'px']}"
- toplimit - muda o limitador inicial do elemento
- bottomlimit - muda o limitador final do elemento
- width - largura do elemento / podemos utilizar variaveis
- parent - id do elemento pai caso tenha / os limitadores passam a ser o do parent
- debug - true / false - exibe os limitadores
#Variaveis
$screenHeight; $screenWidth; $parentWidth; $parentHeight; $parentWidthIn; $parentHeightIn;