JQuery

Calendário interativo

Publicado por antlou em 14/06/2015

jQuery UI é uma das bibliotecas interativas JavaScript mais populares e que facilitam a vida dos programadores.
Esta coleção inclui widgets de GUI, efeitos visuais animados e temas implementados com jQuery, Cascading Style Sheets e HTML.

Vou expôr uma séria de pequenos e simples scripts jquery, utilizando a biblioteca JQuery-ui.

Resultado:

Data:

Irei começar pela apresentação de calendário interativo (datepicker).

calendario_interativo.html



<html>
<head>
  <title>jQuery UI Datepicker</title>
  
  <link rel="stylesheet" href="jquery-ui-1.11.4/themes/smoothness/jquery-ui.css">
  <link rel="stylesheet" href="jquery-ui-1.11.4/jquery-ui.css">
  
  <script src="jquery-2.1.1.js"></script>
  <script src="jquery-ui-1.11.4/jquery-ui.js"></script>
 
  <script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>
</head>
<body>
    <p>Data: <input type="text" id="datepicker"></p>
</body>
</html>

Não esquecer incluir as bibliotecas:

jquery-1.10.2.js ou superior;
jquery-ui.js;
jquery-ui.css (folha de estilos);

dentro do html entre as tags head.

			
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
	
<script src="//code.jquery.com/jquery-1.10.2.js"> </script> 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"> </script>

voltar ao topo ↑

Download Código

Espero ter sido útil. Deixe avaliação ao script

1 votos - 5 pontos - 9 downloads
Média : 5,000

Infoscript - Desenvolvimento de websites, e-commerce e programação

Infoscript tem soluções para desenvolvimento web e programação para aproximar os seus clientes às necessidades atuais do mercado.
O design de produto, a criação de websites e lojas online entre outros, são os principais serviços que temos para lhe oferecer.
Contate-nos através do endereço geral@infoscript.pt
Nós teremos uma solução para si à medida.