Boa noite,
Depois de muito tempo de ter criado o Blog para iniciantes de programação e posteriormente eletrônica venho postar meu primeiro artigo.
Este artigo trata de como alterar o tamanho da imagem de fundo de uma página dinâmicamente, o que para muitos é uma dificuldade grande.
Utilizo um código em php modificado com os fontes citados no próprio código.
Primeiro precisamos escrever o código em php que fará a conversão do tamanho da imagem, para isto utilizamos o código abaixo.
<?php
#recebendo a url da imagem
$filename = $_GET['img'];
$sizeW = $_GET['sizeW'];
$sizeH = $_GET['sizeH'];
#Cabeçalho que ira definir a saida da pagina
header('Content-type: image/jpeg');
#pegando as dimensoes reais da imagem, largura e altura
list($width, $height) = getimagesize($filename);
#setando a largura da miniatura
$new_width = $sizeW;
#setando a altura da miniatura
$new_height = $sizeH;
#gerando a a miniatura da imagem
$image_p = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled($image_p, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
#o 3º argumento é a qualidade da miniatura de 0 a 100
imagejpeg($image_p, null, 50);
imagedestroy($image_p);
//Para salvar a imagem/thumb em um diretório altere a linha
//imagejpeg($image_p, null, 50);
//para
//imagejpeg($image_p, ‘/diretorio/nomeImagem.jpg/’, 50);
//Origem: http://clares.wordpress.com/2008/02/13/gerando-miniaturas-de-imagens-c-php/
//Publicado: fevereiro 13, 2008 por Rafael Clares em PHP
//Modificado: Robson Assis Candido Pereira Faria
?>
Com o código acima através de uma método get padrão passamos o arquivo a ser modificado e quais as dimensões ele deve ter.
Veremos agora como escrever na página html com javascript a tag body com a figura com as dimensões corretas.
<script>
document.write("<body background="'thumb.php?img=imagem.jpg&sizeH="+screen.height+"&sizeW="+screen.width+">");
</script>
No código acima utilizamos screen.height e screen.width para pegar as dimensões da tela, caso queira visualizar melhor o que as duas variáveis fazem, use um alert(screen.height+"x"+screen.width); dentro das tags .
Os dois códigos em conjunto fazem todo o feito, lembrando que o código javascript deve estar no lugar da tag e que o código php deve estar dentro de thumb.php como é chamado no javascript e na mesma pasta que o arquivo html.
O exemplo de figura que eu utilizo está dentro da pasta imagens, que deve estar na raiz junto com o arquivo html e php.
Segue a página html completa:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script>
//alert(screen.width+"x"+screen.height);
</script>
</head>
<script>
document.write("<body background="'thumb.php?img=imagem.jpg&sizeH="+screen.heigth+"&sizeW="+screen.width+">");
</script>
</body>
</html>
Espero ter colaborado.
Nenhum comentário:
Postar um comentário