Arquivos para a categoria: aulas

Exercício F14 – Bibliotecas JavaScript

17 novembro, 2009 (18:07) | aulas | Por: admin

Neste exercício, você vai desenvolver, de maneira colaborativa, exemplos e documentação referente às bibliotecas JavaScript.
1) Escolha duas dentre bibliotecas listadas no resumo a seguir ou procure por alguma biblioteca na Internet:
http://www.brunocampagnolo.com/2009_2/js/libs
Antes de escolher sua biblioteca verifique se alguém já não a escolheu no link abaixo:
http://spreadsheets.google.com/ccc?key=0AqQ2GvdPZmGjdFNrRk5VclFZUnBiMlFUVmRhT1VKTHc&hl=pt_BR
É essencial que cada aluno use uma biblioteca diferente.
Selecione sua biblioteca [...]

Bibliotecas JavaScript

17 novembro, 2009 (18:03) | aulas | Por: admin

Pessoal,
Chegamos a nosso último tópico!
Segue, abaixo e no link.

Layout de elementos em CSS

3 novembro, 2009 (15:08) | aulas | Por: admin

A aula de hoje é uma continuação da aula anterior. Na aula anterior trabalhamos com o embasamento necessário para construir layouts em CSS: as propriedades float, clear, position e width.
O objetivo agora é realizar alguns estudos de caso relacionados a tipos de layout que podem ser implementados através destas propriedades.
Apresentação referente à aula

Posicionamento de elementos em CSS

27 outubro, 2009 (14:20) | aulas | Por: admin

Nas próximas 3 semanas, descansamos um pouco de nosso trabalho com a linguagem JavaScript.
Voltamos hoje a nosso último tópico referente a CSS: como posicionar nossos layouts.

Defesa dos trabalhos F11 e F12

6 outubro, 2009 (19:05) | aulas | Por: admin

Pessoal,
Os exercícios não precisam ser entregues.
Serão cobrados APENAS no dia da defesa: 20 e 21/10/2009.
Não há entrega posterior do exercício!
Lembre-se: no máximo duplas.

Aula V01 – Vocabulário Web – Parte 01

8 setembro, 2009 (20:26) | aulas | Por: admin

Apresentação referente à aula

Exercício F09 – Agenda em JavaScript

25 agosto, 2009 (20:30) | aulas | Por: admin

Carregando…

Aula 14 – JavaScript na prática – Cadastro de Contatos em JavaScript

25 agosto, 2009 (14:49) | aulas | Por: admin

Na aula passada, nós tivemos nosso primeiro contato com a linguagem JavaScript.
Hoje, desenvolveremos um exemplo prático de um aplicativo nesta linguagem.
Faremos o protótipo de uma agenda de contatos. A implementação desta agenda será útil para ilustrar como é a prática de trabalho com JavaScript, como depuramos nosso código e, principalmente, como representamos objetos e vetores.
Esta [...]

Código da aula de 18/08/2009

18 agosto, 2009 (20:37) | aulas | Por: admin

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
#resultado { font-size: xx-large; color: red;}
</style>
</head>
<body>
<form action="">
<label for="nome">Nome: </label>
<input type="text" name="nome" id="nome"><br>
<label for="peso">Peso:</label>
<input type="text" name="peso" id="peso"><br>
<label for="altura">Altura:</label>
<input type="text" name="altura" id="altura"><br>
<input type="button" value="Calcular IMC"
id="btIMC" name="btIMC">
</form>
<div id="resultado"></div>
<script type="text/javascript">
var calcularIMC = function () {
var nome, peso, altura, imc;
nome = document.getElementById("nome").value;
peso = document.getElementById("peso").value;
altura = document.getElementById("altura").value;
imc = peso / [...]

Aula 13 – Introdução ao JavaScript

18 agosto, 2009 (15:06) | aulas | Por: admin

Resumo referente à aula:
http://www.brunocampagnolo.com/2009_2/js/intro/

Aula 12 – Box Model – Elementos em bloco

16 junho, 2009 (16:08) | aulas | Por: admin

O Box Model é a maneira que o CSS representa as dimensões e espaçamentos dos elementos da tela. Esta aula é sobre este modelo. As principais propriedades relacionadas ao box model são:

margin-top, margin-right, margin-bottom, margin-left, margin: determina a margem de um elemento;

padding-top, padding-right, padding-bottom, padding-left, padding: determina o “enchimento” (espaçamento) de um elemento.

border-top-color, border-top-style, border-top-width, [...]

Aula 11 – Propriedade CSS Texto

9 junho, 2009 (16:29) | aulas | Por: admin

O objetivo agora é trabalhar com as propriedades de alteração de texto em CSS.
Algumas destas propriedades são:

letter-spacing: espaçamento das letras do texto;
word-spacing: espaçamento das palavras do texto;
line-height: altura das linhas;
text-align: alinhamento horizontal;
text-decoration: efeitos em texto;
text-indent: distanciamento da 1ª linha do texto;
text-transform: controla a capitalização do texto;
text-shadow: especifica o efeito de sombra em um texto;
vertical-align: alinhamento [...]

Aula 10 – Propriedades CSS – Fonte

26 maio, 2009 (18:47) | aulas | Por: admin

Nas últimas semanas, conhecemos os seletores do CSS 1.0 e CSS 2.1. Voltaremos, futuramente, a lidar com os seletores do CSS 3.0. Hoje, começaremos a aplicar, na prática, os seletores aprendidos com as diferentes propriedades do CSS.
O objetivo da aula de hoje é trabalhar com as propriedades do CSS referentes a tipografia, ou seja, que [...]

Aula 09 – Seletores do CSS 2.1

19 maio, 2009 (13:52) | aulas | Por: admin

Após a exposição acerca dos seletores do CSS 1.0 na aula passada, nosso objetivo hoje é continuar o trabalho com linguagem de seletores.
Desta vez, os seletores que trabalharemos serão os seletores do CSS 2.1.
Tais seletores são aceitos pela maior parte dos navegadores do mercado. Destaca-se, porém, que o Internet Explorer 6 (ie6) não os suporta [...]

Desenvolvido na aula de CSS 1.0 seletores – Turma U1

13 maio, 2009 (20:03) | aulas | Por: admin

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
p, div { background: red; }
.c1 { color: yellow; }
#p2 {font-size: xx-large;}
p em { background: green; } /* todos os em dentro de p*/
a:link { font-size: xx-small; background: orange; }
a:visited { font-size: xx-large; background: white; }
a:active { font-size: medium; background: black;}
p:first-letter { font-size: 60px; [...]

Exemplo trabalhado em Sala Turma V – Seletores

12 maio, 2009 (20:13) | aulas | Por: admin

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
/* Seletor Elemento */
p, div {
color: red;
background: white;
}
.c1 { color: green; background: yellow; }
#p1 { font-size:xx-large; }
/* altere todos os em filhos (dentro) de #p1 */
#p1 em { background: white; }
/* link quando a pagina eh visitada e o link
* não foi clicado [...]

Aula 08 – Seletores do CSS 1.0

12 maio, 2009 (16:00) | aulas | Por: admin

Na aula de hoje, começaremos nosso trabalho com a linguagem CSS. Um dos componentes principais desta linguagem e que permite sua ligação com os elementos de uma página HTML é a linguagem de seletores.
Nosso objetivo será conhecer esta linguagem de seletores nesta e nas próximas aulas.
Destaca-se que a linguagem de seletores não está integrada apenas [...]

Código gerado em sala na aula sobre Formulários (Turma U2)

6 maio, 2009 (21:56) | aulas | Por: admin

<form method="POST"
action="http://www.brunocampagnolo.com/2009li/tools/forms/testform.php">
<fieldset>
<legend>Obrigatorio</legend>
<label for="txtNome">Nome:</label>
<input type="text" value="Jamanta"
id="nome" accesskey="N" name="nome">

<input type="radio" id="rbMasculino" name="sexo"
value="M">
<label for="rbMasculino">Masculino</label>
<input type="radio" id="rbFeminino" name="sexo"
value="F">
<label for="rbFeminino">Feminino</label>
</fieldset>
<fieldset>
<legend>Opcional</legend>
</fieldset>
<input type="submit" value="Ok!">
</form>

Código gerado em sala na aula sobre Formulários (Turma U1)

6 maio, 2009 (20:10) | aulas | Por: admin

<form method="POST"
action="http://www.brunocampagnolo.com/2009li/tools/forms/testform.php">
<fieldset>
<legend>Obrigatorio</legend>
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome"
accesskey="N">
<input type="radio" id="masc" name="sexo"
value="M">
<label for="masc">Masculino</label>
<input type="radio" id="fem" name="sexo"
value="F">
<label for="fem">Feminino</label>
</fieldset>
<fieldset>
<legend>Opcional</legend>
</fieldset>
<input type="submit" value="Ok!">
</form>

Aula 07 – Formulários

5 maio, 2009 (19:10) | aulas | Por: admin

A aula de hoje tratará de um dos assuntos mais importantes para o desenvolvedor web: a criação de formulários.
A linguagem HTML possui um conjunto de tags que permite a interação com o usuário de um site tanto com o JavaScript quanto com o Servidor Web.
Sobre este tema, a leitura mais recomendada é a própria tradução [...]

Aula 06 – Tabelas em HTML

31 março, 2009 (19:04) | aulas | Por: admin

Tabelas são essenciais para visualização de elementos em formato tabelado: linhas e células.
Em HTML, as tabelas são construídas através das tags:

Criação de contâiner de tabela: table;
Criação de contâiner de linha: tr;
Definição de célula: td, th
Legenda: caption;
Cabeçalho de tabela: thead;
Corpo de tabela: tbody
Rodapé de tabela: tfoot;
Agrupamento de colunas: colgroup, col.

Aula05 – Listas e Links em HTML

24 março, 2009 (19:05) | aulas | Por: admin

O objetivo de hoje é trabalhar com listas e links em HTML.
Existem 3 tipos de listas: ordenadas, não-ordenadas e listas de definição.
Veremos futuramente que as listas não serão úteis apenas para a exibição listagem de itens, mas também serão úteis na criação de menus e barras de navegação.
Os links, por sua vez, são um dos [...]

Aula 04 – Imagens

17 março, 2009 (19:10) | aulas | Por: admin

Na aula de hoje, começaremos efetivamente o trabalho com a linguagem HTML.
Nosso primeiro assunto será o trabalho com IMAGENS.
Atenção: os arquivos utilizados na aula devem ser descompactados em alguma pasta de seu computador!
Baixar aqui ou aqui.
Download da Apresentação da aula aqui ou aqui

Aula 03 – Introdução ao JavaScript

10 março, 2009 (19:10) | aulas | Por: admin

Esta é nossa última aula de introdução geral à disciplina de Laboratório de Informática.
Após conhecermos as linguagens HTML e CSS nas aulas anteriores, vamos conhecer a linguagem JavaScript na aula de hoje.
Download da aula aqui.

Aula 02 – Introdução ao CSS

3 março, 2009 (19:09) | aulas | Por: admin

Na aula de hoje vamos conhecer a linguagem CSS.
Tal linguagem nos será útil para alterações no layout e formatação de nossas páginas Web.

Aula 01 – 17 e 18/02/2009 – Introdução ao HTML

17 fevereiro, 2009 (14:18) | aulas | Por: admin

Hoje, nosso foco será na linguagem HTML. Mais importante do que conhecer suas tags será entender qual é a filosofia de desenvolvimento web na qual o HTML se insere.
Além disso, teremos nosso primeiro contato com as ferramentas: Aptana, Web Developer e Firebug.
Download 01-introhtml-final-ppt

Aula 00 – 10 e 11/2/2009 – Introdução à Plataforma Web

16 fevereiro, 2009 (16:12) | aulas | Por: admin

Após a apresentação inicial da disciplina, passamos ao início de nossa disciplina.
Nesta aula, trago o básico sobre a história da plataforma Web e o seu funcionamento básico.
Além da apresentação abaixo, sugiro também assistir ao vídeo sobre a História da Internet.
Download 00-webfinal-ppt

Aula 00 – 10 e 11/02/2009 – Apresentação da Disciplina

10 fevereiro, 2009 (14:00) | aulas | Por: admin

Nesta aula, nosso objetivo será apresentar o que é a disciplina de Laboratório de Informática 1 e 2.
Ainda não iremos em nosso Laboratório. A divisão das equipes de laboratório será disponibilizada a seguir.

Download 00-apresentacao.ppt