sexta-feira, 21 de setembro de 2012

Aula 21/09 IFrames

Hoje a aula será sobre iframes.

No começo pode parecer um pouco confuso mas logo você verá como eles são legais e podem ser bem aproveitados em alguns sites.

IFrames são quadros que podemos colocar em nossa página da internet, este quadro tem a capacidade de carregar um conteúdo de outro site ou página dentro dele.

Vou mostrar um exemplo com algumas imagens:
Construí uma página simples com o texto "E aqui abaixo você tem o UOL rodando dentro da minha página".
Veja o exemplo:


Bem, agora vou mostrar o que acontece quando colocamos um IFrame dentro da página e programamos ele para acessar a página do UOL. Veja:


Bacana né, vamos ver como isso fica em códigos.

IFrame
Para criar um IFrame basta usar a tag <iframe> fazendo uso de três propriedades básicas:
src: o local aonde você indica que nome de página ou site irá abrir.
width: a largura (dimensão) do seu iframe dentro da página.
height: a altura do seu iframe dentro da página.

Exemplo:
<iframe src="http://facebook.com" width="400" height="250"></iframe>

Simples não?
Então vamos ao que interessa:

Primeiro, veja como ficou o código da página simples, sem o IFrame:


Agora, note quando adicionamos o comando do iframe na página que faz aparecer uma página dentro da outra.


Fantástico né?

Bons exercícios e até mais.

quinta-feira, 13 de setembro de 2012

Aula 14/09 Javascript

Esta aula ensinará como adicionar alguns códigos e comandos especiais a sua página na internet, permitindo criar alguns efeitos dinâmicos e interessantes.
Para tal, utilizaremos uma linguagem de programação, no caso, o javascript.

Mas o que é JavaScript?
JavaScript é uma linguagem de script padronizada pela Ecma international nas especificações ECMA-262 e ISO/IEC 16262 e é atualmente a principal linguagem para programação client-side em navegadores web. Foi concebida para ser uma linguagem script com orientação a objetos baseada em protótipos, tipagem fraca e dinâmica e funções de primeira classe. Possui suporte à programação funcional e apresenta recursos como fechamentos e funções de alta ordem comumente indisponíveis em linguagens populares como Java e C++.

O que dá pra fazer com JavaScript?
Em uma página web, podemos apresentar mensagens, solicitar informações, fazer perguntas, validar formulários e movimentar elementos da página de forma dinâmica!

Como inserir um script na página?
É simples, basta utilizar a tag script para dar início e fim ao seu javascript. Veja:
< script >
    // Aqui dentro vai a programação em javascript
</ script >

Alguns comandos básicos
Agora vamos aprender a incrementar nossa página com alguns comandos básicos.

Mensagem
Podemos dar uma mensagem de boas vindas ao entrar na página que tal?

<script>
    // Mensagem de boas vindas
    alert("Bem vindo ao meu site! Aproveite.");
</ script >


Pergunta
Também é possível solicitar a resposta à uma pergunta, veja como:

< script >
    // Faz uma pergunta para responder OK ou Cancela.
    var respondeu = confirm("Este site está em desenvolvimento, ok?");
</ script >


Interpretando a pergunta
Dá para usar a resposta da pergunta para alguma coisa, que tal?
Para isso precisamos de verificar se o internauta respondeu a pergunta, ou seja, inserir uma condição ao nosso código, SE ele respondeu, nós damos uma mensagem, SE NÃO, não fazemos nada.

< script >
    // Faz uma pergunta para responder OK ou Cancela.
    var respondeu = confirm("Este site está em desenvolvimento, ok?");
    // Se respondeu
    if (respondeu) {
       // Responde ao internauta
       alert("Muito bem, obrigado por concordar.");
    }
</ script >


Solicitando informações para o internauta
Também podemos solicitar que o internauta nos informe qualquer coisa, por exemplo, vamos solicitar a sua idade. Veja como:

< script >
    // Solicita a idade do internauta
    var idade = confirm("Digite a sua idade por favor:");
    // Confirma a idade do internauta
    alert("Ok, você informou que sua idade é " + idade);
</ script >

Aula 14/09 Revisão Tags HTML

Abaixo uma pequena revisão das Tags HTML estudadas até o momento no curso e algumas mais:

- Início e Fim documento HTML
<html> e </html>

- Cabeçalho da página
<head> e </head>

- Título da página (dentro do cabeçalho)
<title> e </title>

- Corpo da página
<body> e </body>

- Títulos de documento
<h1> e <h1> (Sendo de 1 à 6).

- Parágrafo de texto
<p> e </p>


- Quebra de linha no texto
<br />


- Texto em negrito
<b> e </b>

- Texto em itálico
<i> e </i>

- Texto em sublinhado
<u> e </u>

- Alterando a fonte (letra) do texto
<font face="nome da fonte" size="tamanho da fonte" color="cor da fonte"> e </font>
Ex: <font face="arial" size="3" color="blue">Texto azul</font>

- Inserindo uma imagem na página
<img src="caminho imagem" width="largura" height="altura">
Ex: <img src="foto.jpg" width="100" height="100">

- Criando uma tabela
<table border=1> e </table>

- Inserindo uma linha na tabela
<tr> e </tr>

- Inserindo uma coluna (célula) na tabela
<td> e </td>

- Criando um link para outra página
<a href="endereço da página"> e </a>

- Inserindo um bloco javascript (programação) na página
<script> e </script>


- Inserindo uma linha divisória na página
<hr />