Number.prototype.formatMoney = function(c, d, t){
var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};
// usando
(1000).formatMoney(2, ',', '.');
//retorna 1.000,00
Fonte: http://stackoverflow.com/q/149055/1582080
Mostrando postagens com marcador JavaScript. Mostrar todas as postagens
Mostrando postagens com marcador JavaScript. Mostrar todas as postagens
quarta-feira, 17 de maio de 2017
quarta-feira, 15 de outubro de 2014
Botão para rolar para o topo da página com jQuery
<script>
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
</script>
HTML
<a href="#top">go top</a>
sexta-feira, 10 de outubro de 2014
REALIZAR SOMA COM JAVASCRIPT: Como somar valores vindos de um campo input type text do formulário com javascript
Definição da função parseFloat:
A função parseFloat() analisa uma string e retorna um número em ponto flutuante.
Esta função determina se o primeiro caractere na string de caracteres especificada é um número. Se for, ele analisa a sequência até que atinja o fim da sequência, e retorna o número como um número, e não como uma cadeia de caracteres.
SOLUÇÃO:
Temos um campo texto:
[sourcecode language="html"]
<input type="text" name="txtValor" id="txtValor">
[/sourcecode]
<input type="text" name="txtValor" id="txtValor">
[/sourcecode]
Definimos uma variável pra realizar a soma:
[sourcecode language="javascript"]
var total = 0;
[/sourcecode]
var total = 0;
[/sourcecode]
Efetuamos a soma pegando o campo text com jQuery:
[sourcecode language="javascript"]
total = parseFloat(total) + parseFloat($(‘#txtValor’).val());
[/sourcecode]
total = parseFloat(total) + parseFloat($(‘#txtValor’).val());
[/sourcecode]
Exibindo o total:
[sourcecode language="javascript"]
alert(total);
[/sourcecode]
alert(total);
[/sourcecode]
Pronto, tenho uma soma, que pode ser feita inclusive com pontos flutuantes.
fonte: http://dilbertorosa.com/tag/somar-e-nao-concatenar-valores-com-javascript
segunda-feira, 22 de setembro de 2014
Redireciona para outra páginas após algum tempo de inatividade.
Segue o código.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
var timeout;
$(document).on("mousemove keydown click", function () {
if (timeout) {
clearTimeout(timeout);
}
timeout = setTimeout(function () {
window.location = "screensaver.html";
}, 3 * 60 * 1000);
}).click();
});
</script>
sexta-feira, 4 de outubro de 2013
Lendo variáveis de um URL com JavaScript
Esta funcção basicamente lê a url da página atual, executa algumas expressões regulares na URL, em seguida, grava os parâmetros de URL em uma matriz associativa, que podemos acessar facilmente.
Então, como exemplo, se tivéssemos o seguinte url com o javascript na parte inferior no lugar.
http://eniomarcelo.com.br/index.php?id=123&page=home
Para pegar o valor 123 dentos da variável id e para pegar o valor home dentro da variável page, segue a seguinte função em javascript:
<script>
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
var first = getUrlVars()["id"];
var second = getUrlVars()["page"];
alert(first);
alert(second);
</script>
Espero que gostem. Grande Abraço.
fonte : http://papermashup.com/read-url-get-variables-withjavascript/
Então, como exemplo, se tivéssemos o seguinte url com o javascript na parte inferior no lugar.
http://eniomarcelo.com.br/index.php?id=123&page=home
Para pegar o valor 123 dentos da variável id e para pegar o valor home dentro da variável page, segue a seguinte função em javascript:
<script>
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
var first = getUrlVars()["id"];
var second = getUrlVars()["page"];
alert(first);
alert(second);
</script>
Espero que gostem. Grande Abraço.
fonte : http://papermashup.com/read-url-get-variables-withjavascript/
terça-feira, 10 de setembro de 2013
Reveal – Plugin jQuery para criação de Modal e Lightbox
Existem várias formas de mostrar o conteúdo do site de forma bonita e ao mesmo tempo
funcional. Fora isso é importante sempre pensar na experiência do usuário, para facilitar o modo que as informações são mostradas e entregues.
Nos primórdios da Web existiam os famigerados pop-ups, que só atrapalhavam a navegação, além de irritar os usuários. O pior é que esse tipo de recurso é utilizado até hoje e muita gente simplesmente nem sabe que eles existem, pois utilizam os bloqueadores que já fazem parte dos navegadores modernos.
Mas, agora, é possível criar um efeito bonito e ao mesmo tempo funcional para abrir informações extras na tela sem prejudicar a navegação…
Ficou fácil criar o efeito Ligthbox!
Reveal é um plugin jQuery para a criação de Modal em qualquer tipo de site ou projeto. Incluindo algumas poucas linhas ao seu código é possível criar umLigthbox elegante sem precisar alterar nada.
Basta chamar os arquivos “js” e incluir a tag “data-reveal-id” em seus links. Mais fácil que isso? Não existe!
Download e Informações
Site Oficial e Demonstração: http://www.zurb.com/playground/reveal-modal-plugin
É a sua chance de criar sites mais modernos, bonitos e funcionais.
fonte : http://www.tekzoom.com.br/reveal-plugin-jquery-para-criacao-de-modal-e-lightbox/
Vegas – Coloque um Slideshow como Background de seus sites
Hoje vamos apresentar um recurso que pode interessar muito aos designers e fotógrafos que pretendem criar um site para expor seus trabalhos. Mas claro que isso não se limita apenas a estes dois profissionais, muito pelo contrário, com certeza será útil para a criação de sites que precisam de um Slideshow de imagens que realmente chame a atenção do visitante.
Vegas – Seu background nunca mais será o mesmo!
O Plugin jQuery Vegas cria backgrounds em tela cheia em qualquer tipo de site. O mais interessante é a possibilidade de criar um Slideshow de imagens e fotos, que podem ser escolhidas pelos usuários ou até mesmo de forma aleatória.
Imagine criar um site de portfólio e ao invés de colocar no ar uma página com seus trabalhos poder mostra-los no fundo do site, enquanto o restante do conteúdo fica por cima. Com certeza um recurso muito bacana e que irá impressionar.
Download e Informações
Gostou da ideia? Então não perca mais tempo e conheça um pouco mais sobre o Vegas:
fonte : http://www.tekzoom.com.br/vegas-background/
Tabulous – Plugin jQuery para criação de Abas (Tabs)
Existem muitas formas de apresentar o conteúdo de uma página e muitas vezes temos muitos textos e imagens e pouco espaço para mostra-los. Foi pensando nisso que trazemos hoje uma solução muito bonita, moderna e funcional para criação de abas, ou guias, de navegação e conteúdo que podem ser utilizadas em praticamente qualquer site ou projeto web.
Tabulous – Crie facilmente Abas utilizando jQuery
Tabulous.js é um Plugin jQuery para criação de Abas que podem ser utilizadas em qualquer página HTML. O mais interessante deste script é a possibilidade de utilizar efeitos de transições e animações entre as guias.
A implementação do Tabulous é muito simples e com apenas algumas linhas de código você conseguirá criar abas para apresentar os mais diversos textos, imagens, vídeos e qualquer outro conteúdo que exista em suas páginas.
O recurso mais legal do plugin são as transições que podem ser utilizadas para carregar os conteúdos. Entre os efeitos disponíveis o que mais gostamos foi o Flip.
Para usar o Tabulous é só fazer a chamada dos arquivos “CSS” e “JS” que fazem parte do pacote. Não podemos esquecer também do jQuery que precisa ser instanciado para que tudo funcione corretamente.
Com toda a certeza este é um plugin essencial para quem pretende criar um site com conteúdos diversos e apresenta-los de um jeito diferente e sem esquecer a usabilidade.
Download e Informações
O Plugin jQuery Tabulous.js pode ser baixado e utilizado sem nenhum tipo de restrição. É importante lembrar que o jQuery é obrigatório para que tudo funcione de acordo.
No site oficial é possível conferir toda a documentação necessária para fazer oTabulous rodar. Não esqueça de usar com moderação para não correr o risco de complicar a navegação do usuário.
fonte : http://www.tekzoom.com.br/tabulous-plugin-jquery-para-criacao-de-abas-tabs/
Owl Carousel – Crie Slider Facilmente com este Plugin jQuery
Chegou a hora de conhecer um novo plugin jQuery para criação de “sliders” que podem ser utilizados para criação de galerias compatíveis com desktop,smartphones e tablets.
Com certeza esta é uma solução muito interessante para quem esta produzindo um novo site ou até mesmo um aplicativo web que necessita mostrar algumas informações de forma simples e moderna.
Owl Carousel – Plugin jQuery Open Source
Owl Carousel é um script gratuito para criação de carousel totalmenteresponsivo, ou seja, seus sliders serão compatíveis com qualquer tamanho ou resolução de tela.
O mais interessante neste plugin jQuery é a sua facilidade de uso e configuração. Com apenas algumas linhas de código será possível criar galerias de imagens e conteúdos em questão de minutos.
Outro recurso muito útil do Owl Carousel é a sua total compatibilidade com telas touch, ou seja, seu carousel poderá ser utilizado em smartphones e tablets sem nenhum tipo de configuração extra. Realmente uma ótima notícia para quem pretende criar um APP.
É possível customizar o plugin alterando algumas opções muito interessantes como modificar a velocidade de transição e ativar o modo de inicialização automática dos sliders.
Enfim, uma ótima solução para quem precisa mostrar de forma dinâmica imagens, fotos e vídeos.
Download e Informações
O Plugin jQuery Owl Carousel é totalmente gratuito para download e uso. Você poderá baixa-lo e utiliza-lo em seus projetos web sem nenhum tipo de limitação e toda a documentação encontra-se no site oficial que você confere nos links a seguir.
Agora é com você! Baixe o plugin e realize seus testes para começar a utilizar como achar melhor. Não deixe de conferir todas as opções e configurações possíveis, com certeza deixará tudo ainda melhor.
fonte : http://www.tekzoom.com.br/owl-carousel-crie-slider-facilmente-com-este-plugin-jquery/
Nikebetterworld – Veja como Criar uma One Page Parallax
Por alguns meses o site Nikebetterworld foi a maior referência na web quando o assunto era Parallax. Hoje este projeto da Nike mudou bastante e esta ainda mais bonito, mas a versão anterior continua atual, moderna e no mínimo impressionante.
Foi pensando nisso que resolvemos postar hoje esta dica para quem pretende criar uma One Page com recursos visuais avançados. Se você quer deixar seus visitantes com vontade de voltar mais vezes para conferir seu conteúdo, fique ligado no que iremos mostrar aqui…
Nikebetterworld Clone – Plugin jQuery Parallax
jQuery Parallax é um plugin para criação de One Pages com efeitos de profundidade e elementos em velocidades diferentes, ou seja, este framework irá ajuda-lo a criar uma página Parallax de uma forma muito simples e rápida.
O mais legal é que este script foi baseado na primeira versão do site Nikebetterworld, que até pouco tempo era a maior referência online quando o assunto era Parallax. Hoje já existem projetos muito mais bonitos e até mesmo funcionais, mesmo assim é algo que não poderia deixar de ser postado aqui noTekZoom.
Para trabalhar com o jQuery Parallax é só realizar o download do pacote e utilizar os arquivos de demonstração como base. Você verá que é tudo muito fácil e tranquilo de ser feito.
Download e Informações
O jQuery Parallax pode ser baixado e utilizado livremente sem nenhum tipo de restrição. Como já falado é importante baixar e estudar os arquivos de exemplos e com um pouco de paciência você será capaz de criar qualquer tipo de projeto utilizando o recurso Parallax.
fonte : http://www.tekzoom.com.br/nikebetterworld-criar-one-page-parallax/
quinta-feira, 1 de agosto de 2013
Validação de Formulários com JQuery
Segue o exemplo:
Exemplo de uso: http://blog.clares.com.br/validacao-de-formularios-com-jquery-plugin-atualizado/
demo download
demo download
As instruções estão no arquivo leia-me.txt
O plugin pode ser customizado de acordo com suas necessidades, as mensagens de validação podem ser alteradas no arquivo.
fonte : http://blog.clares.com.br/validacao-de-formularios-com-jquery-plugin-atualizado/
Validação de Formulários com JQuery
Segue o exemplo:
Exemplo de uso:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
| </pre><!DOCTYPE html><html> <head> <title>Validate Plugin</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script src="js/jquery.min.js" type="text/javascript"></script> <script src="js/jquery.validate.js" type="text/javascript"></script> <link href="css/validate.css" type="text/css" media="screen" rel="stylesheet" /> <!--[if lte IE 7]> <link href="css/validate_ie7.css" type="text/css" media="screen" rel="stylesheet" /> <![endif]--> </head> <body> <div id="wrap"><form id="f1" class="validate" action="" method="post" > <p> <label>Combo:</label> <select name="combo" id="combo" class="required"> <option value="">Selecione um item na lista</option> <option value="0">AA</option> <option value="1">BB</option> </select> <span>Selecione um item</span> </p><p> <label>Nome:</label> <input type="text" name="nome" id="nome" class="required" minlength="5" /> <span>Informe seu nome completo</span> </p><p> <label>Telefone:</label> <input type="text" name="fone" id="fone" class="required fone" /> <span>Informe seu telefone com DDD</span> </p> <p> <label>Obrigatório - Mínimo 5 letras:</label> <input type="text" name="str" id="str" class="required" minlength="5" /> <span>Campo requerido, informe ao menos 5 letras</span> </p><p> <label>Data:</label> <input type="text" name="data" id="data" class="required data" maxlength="10" /> <span>Campo requerido, informe uma data válida</span> </p><p> <label>CPF:</label> <input type="text" name="cpf" id="cpf" class="required cpf" /> <span>Campo requerido, informe um CPF válido</span> </p> <p> <label>CNPJ:</label> <input type="text" name="cnpj" id="cnpj" class="required cnpj" /> <span>Campo requerido, informe um CNPJ válido</span> </p> <p> <label>Numérico Mínimo 5 caracteres:</label> <input type="text" name="num" id="num" class="required numeric" minlength="5" maxlength="10" /> <span>Campo requerido, apenas números</span> </p><p> <label>Email:</label> <input type="text" name="email" id="email" class="required email" /> <span>Campo requerido, informe um e-mail válido</span> </p><p> <label>Senha - Mínimmo 4 caracteres</label> <input type="password" name="password" id="password" class="required password" minlength="4" /> <span>Campo requerido, informe ao menos 4 caracteres</span> </p><p> <label>Repetir Senha </label> <input type="password" name="rpassword" id="rpassword" class="required password" minlength="4" /> <span>Repita a senha</span> </p> <p> <button class="button blue submit">Enviar</button> <button class="button gray reset">Limpar</button> </p></form> </div> </body></html><pre> |
As instruções estão no arquivo leia-me.txt
O plugin pode ser customizado de acordo com suas necessidades, as mensagens de validação podem ser alteradas no arquivo.
fonte : http://blog.clares.com.br/validacao-de-formularios-com-jquery-plugin-atualizado/
Assinar:
Postagens (Atom)