Archive for the 'Desenvolvimento Web' Category

Novidade no Smashing Magazine Monday, October 22nd, 2007

Depois de trazer milhares de dicas CSS, tutoriais e fontes grátis, o blog Smashing Magazine traz agora uma novidade um tanto quanto peculiar: Monday Inspiration;

O Objetivo é ajudar os designers numa segunda feira a vencer o bloqueio mental! Várias idéias serão postadas toda segunda aumentando o (grande) acervo de dicas e idéias já disponível no Blog. O primeiro post da série é sobre combinação de cores para a criação do layout. Vale a pena dar uma olhada e assinar o feed do Blog;

Aulas de PHP no Webly Monday, October 15th, 2007

As inscrições já estão fechadas, mas basta se cadastrar e enviar uma Mensagem Pessoal para o Pinguim e pedir para ser inscrito nas aulas. Todos os detalhes serão dados no próprio fórum. E se você não quiser/conseguir se inscrever para as aulas, não fique triste. Toda vez que uma aula nova for postada, a aula anterior será disponibilizada em formato PDF para download. Tá esperando o quê? Visite www.webly.com.br/forum e cadastre-se.

Listagem de Diretório Tuesday, August 7th, 2007

Fuçando no manual do PHP achei a função glob(), que lista os arquivos de uma pasta de acordo com o a extensão expecificada ou lista todos (*);

Bem, sem mais delongas, segue o script

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Lista de Diretórios v1.0</title>
</head>
<body>
<h1>
<?
define(”ROOT”,$DOCUMENT_ROOT);
function listaDiretorios($dir=”)
{
$d = strlen($dir) -1;
($dir[$d] != “/”) ? $dir.”/” : false;
$lista = glob(ROOT.”/”.$dir.”*”);
foreach($lista as $value)
{
is_dir($value) ? $diretorios[] = str_replace(ROOT.”/”.$dir,”",$value) : false ;
}
return $diretorios;
}
function listaArquivos($dir=”)
{
$d = strlen($dir) -1;
($dir[$d] != “/”) ? $dir.=”/” : false;
$lista = glob(ROOT.”/”.$dir.”*”);
foreach($lista as $value)
{
!is_dir($value) ? $arquivos[] = str_replace(ROOT.”/”.$dir,”",$value) : false ;
}
return $arquivos;
}
?> Lista de Diretórios
</h1>
<h3>Listando diretório: <a href=”/index.php”>raiz/</a>
<?=@$dir;?>
</h3>
<h3>Diretórios:</h3>
<p><?
(empty($dir)) ? $diretorios = listaDiretorios() : $diretorios = listaDiretorios($dir);
foreach($diretorios as $link => $diretorio)
{
?><a href=”?dir=<?=$diretorio;?>”><?=$diretorio;?></a><br /><?
}
?>
<h4>Arquivos:</h4>
<p><?
(empty($dir)) ? $arquivos = listaArquivos() : $arquivos = listaArquivos($dir);
foreach($arquivos as $link => $arquivo)
{
?><a href=”<?=@$dir;?>/<?=$arquivo;?>”><?=$arquivo;?></a><br /><?
}
?></p>
</body>
</html>

Esta versão está bem simples, apenas separa diretórios e arquivos. Melhorias para a próxima versão, por favor, deixe um comentário.

Para ver a versão mais nova rodando (usando url amigável) visite meu disco virtual: http://www.filipekiss.com

XML no Flash CS3 (Parte I) Wednesday, August 1st, 2007

Recentemente precisei trabalhar com o Flash CS3;

A tarefa era montar um player de mp3 para um site que permitisse aos visitantes criarem suas playlists. As playlists seriam criadas pelo PHP no padrão XSPF;

Então, lá vou eu… Pela primeira vez mexer com XML no CS3… E de repente percebo que não se usa mais os padrões do Flash 8 (A.S. 2.0) e que com o novo CS3 veio o A.S. 3.0

Pesquisando um pouquinho, cheguei até este site com este tutorial incrível sobre XML; Aqui vai uma adaptação do tutorial pra vocês

A estrutura de um XML pode ser representada da seguinte maneira:

Para criar esse XML, poderiamos usar o seguinte código:

A maior das diferenças em como tratar esse XML no Flash CS3 (ou Flash 9.0, como preferir) é que algumas funções como meuXML.load(”arquivo.xml”); Não funciona mais…

(more…)

Novo Layout e uma rápida dica de CSS Wednesday, May 2nd, 2007

Então? O que acharam do meu novo layout? Bonitinho não? Estou começando agora a entender o Wordpress =) E começamos com um layout bonitinho.

Agora, a separação é oficial. O meu outro blog já está no ar (com dois post até o presente momento), pra que eu possa postar as coisas pessoais lá, e as coisas como WebStandards e etc aqui.

Dica Rápida de CSS:

Não misture padding com float.

Isso mesmo! Não use o padding na mesma camada (div) que você usou o float. Pra variar, a maioria dos problemas com isso ocorre no IEca, mas já vi acontecer no FF tbm. Coloque o float numa div, e o padding numa div dentro da div com o float. Entendeu? Não? Calma! Vamos para o exemplo:

<div style=”float: left;”><div style=”padding: 5px 0px 2px 5px”>Texto com Padding</div></div>

Assim a sua div com float fica bem onde ele deve estar. E não use o modo acima. Utilize classes ou ids, ok? Separe o CSS do (x)HTML e por sua vez estes dois do JS.

Espero que tenha Ajudado

Classe PopUp (Parte 2) Tuesday, April 17th, 2007

Muito bem. Na primeira parte nós criamos uma classe para identificar os links que eram popup. Agora, com um pouco de JavaScript nós vamos adiciona o popup automaticamente a essas funções.

O código é o seguinte:

  1. <script type="text/javascript">
  2. //Função criada pelo Micox. Apenas adicionei o return false;
  3. function abrepop(url){
  4. window.open(url,'janela','width=400,height=500,top=100,left=100,resizable=yes')
  5. return false;
  6. }
  7. //Função que ira 'acoplar' a função abrepop em todos os links da classe popup
  8. function popLinks()
  9. {
  10. var inputs //define a variavel inputs
  11. //Faz um loop através de todos os links
  12. inputs=document.getElementsByTagName('a');
  13. for(i=0;i<inputs.length;i++) //Para cada link encontrado...
  14. {
  15. // ...verifica se a classe contém a palavra popup
  16. if(/popup/.test(inputs[i].className))
  17. {
  18. //Adiciona a função ao Clique do link;
  19. inputs[i].onclick=function(){ return abrepop(this);}; //Lembra que eu adicionei o return false no fim da função?
  20. //Pois bem, isso serve para que o link seja aberto apenas no popup e não na página
  21. }
  22. }
  23. }
  24. window.onload = function () { popLinks() } //Ao carregar a janela, executa a junção da função aos links popup;
  25. </script>

Espero que vocês tenham gostado e que tenha ajudado alguém =)

Loader com JavaScript Crossbrowser Sunday, April 8th, 2007

O resultado é um loader que funciona em qualquer browser, assim como esse do meu site.
Testado com o I.E 6+, Opera 9+ e Firefox 2

(more…)

Classe Pop-Up Tuesday, April 3rd, 2007

Estava lendo o blog do Micox hoje de manhã e encontrei este artigo. Bastante interessante. Aproveitando a inspiração (e a dica do Micox), aqui vai um pequeno tutorial de como criar a classe de links pop-ups.

Resultado: popUp

(more…)