Archive for the 'WebStandards' Category

Novidade no Smashing Magazine Monday, October 22nd, 2007

Posted in Desenvolvimento Web, WebStandards | 1 Comment »

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;

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

Posted in PHP, Desenvolvimento Web, WebStandards | 1 Comment »

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

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

Posted in Desenvolvimento Web, WebStandards | No Comments »

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

Posted in Desenvolvimento Web, WebStandards | 2 Comments »

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
  12. //Faz um loop através de todos os links
  13. inputs=document.getElementsByTagName('a');
  14. for(i=0;i<inputs.length;i++) //Para cada link encontrado...
  15. {
  16. // ...verifica se a classe contém a palavra popup
  17. if(/popup/.test(inputs[i].className))
  18. {
  19. //Adiciona a função ao Clique do link;
  20. inputs[i].onclick=function(){ return abrepop(this);}; //Lembra que eu adicionei o return false no fim da função?
  21. //Pois bem, isso serve para que o link seja aberto apenas no popup e não na página
  23. }
  24. }
  25. }
  26. window.onload = function () { popLinks() } //Ao carregar a janela, executa a junção da função aos links popup;
  27. </script>

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