[JavaScript] - Redimensionar Imagem e Colocar Link

[CCV_Pinto]

fui atrás desse recurso para nosso fórum.. mas em nenhum lugar tinha do jeito q eu queria... achei um bem parecido como mod do vBulletin... dae alterei um pouco para funcionar do jeito q eu queria

o q eu queria:

de acordo com a resolução do usuário as imagens dos posts fossem redimensionadas...

agora reparem q não poderia ser uma porcentagem da resolução do usuário... pq o lado eskerdo do post aki q tem o avatar é fixo... em uns 250 pixels... então o ideal seria q eu pudesse setar o máximo das imagens para

resolução horizontal do usuário - constante...

e foi isso q eu fiz:

o argumento obj será o elemento "img" que será passado para a função

function resize_image(obj, link, valor)
{

    var browserwidth = window.document.body.clientWidth;
    var maxwidth = browserwidth - valor; 

    if (obj.width > maxwidth)
    {
        obj.style.cursor = 'pointer';
        obj.style.width = maxwidth + 'px';
        obj.style.height = parseInt(obj.height * maxwidth / obj.width) + 'px';
        obj.onclick = function()
        {
            window.open(link, '_blank');
            return false;
        };
    }
}

a chamada da função é feita em cada tag img do html

para parametrizar o link da imagem e o valor a subtrair da resolução usei php... não sei como deveria fazer para pegar o link da imagem com próprio javascript.. talvez algo como .getAttribute('src')

<img onload=resize_image(this, $link, $valor) src=$link />

é um código simplezinho q mostra um pouco sobre como alterar um elemento usando javascript

abraços

[CCV_iStiu]

um dia eu ainda vou aprender isso

[CCV_HEALbra]

nao uso muito js...vc nao poderia usar isso no php?
bom..nao costumo fazer isso mas pra estudo está aqui minha função para redução e criação de thumb...caso vc queira usar no fórum:

#######################
#Esse script foi criado por:       #
#Eric Maicon Silva Sousa         #
#Crash                                #
#ericmaicon@jovenet.com.br  #
#ericmaicon@gmail.com        #
####################

class IMG {
    var $campo;
    var $caminho;
    var $t;
    
    var $imagem;
    var $nome;
    
    var $origem_x;
    var $origem_y;
    var $ext;
    
    var $thumbnail;
    var $img_origem;
    
    var $x_marca;
    var $marca;
    var $y_marca;
    var $imagem1;
    
    var $x;
    var $y;
    
    var $img_final;
    var $local;
    
    var $branco;
    var $preto;
    var $texto;

    var $campo_tb_ft;
    var $i;
    var $th;
    
    var $tamanho_h;
    var $tamanho_w;

    function imagem($campo,$caminho,$texto,$t,$marca,$i,$th, $tamanho_h, $tamanho_w) {
        $this->campo = $campo;
        $this->caminho = $caminho;
        $this->texto = $texto;
        $this->t = $t;
        $this->imagem1 = $marca;
        $this->i = $i;
        $this->th = $th;
        $this->tamanho_h = $tamanho_h;
        $this->tamanho_w = $tamanho_w;
                
        //Pega a imagem temporária
        //se tiver $i é array(inserir multiplo)
        if($this->i<> '') {
            $this->nome = $_FILES[$this->campo][name][$i];
            $this->imagem = $_FILES[$this->campo][tmp_name][$i]; 
        } else {
            $this->nome = $_FILES[$this->campo][name];
            $this->imagem = $_FILES[$this->campo][tmp_name]; 
        }
        //pega tamanho, largura e extensao da img passada
        list($this->origem_x, $this->origem_y, $this->ext) = getimagesize($this->imagem);
        
        //se ext = 1 entao é gif
        if($this->ext == 1) {
            $this->img_origem = imagecreatefromgif($this->imagem);
            //nome.gif
            $this->thumbnail = explode(".", $this->nome);
            $this->thumbnail = $this->thumbnail[0]."-".time()."_alt.gif";    
        }
                    
        //se ext = 2 entao é jpg
        if($this->ext == 2) {
            $this->img_origem = imagecreatefromjpeg($this->imagem);
            //nome.jpg
            $this->thumbnail = explode(".", $this->nome);
            $this->thumbnail = $this->thumbnail[0]."-".time()."_alt.jpg";    
        }
        
        //se ext = 3 entao é png    
        if($this->ext == 3) {
            $this->img_origem = imagecreatefrompng($this->imagem);
            //nome.png
            $this->thumbnail = explode(".", $this->nome);
            $this->thumbnail = $this->thumbnail[0]."-".time()."_alt.png";    
        }
                
        //cria a logo da empresa na foto
        list($this->x_marca, $this->y_marca) = getimagesize($this->imagem1);
        $this->marca = imagecreatefromgif($this->imagem1);
          
        //define o tamanho...se t_vertical for maior que 200 ele diminui...se nao ele continua
        if($this->origem_y >  $this->origem_x) {        
            if($this->origem_y > $this->t) {
                $this->y = $t;
                $this->x = $this->origem_y/$this->t;
                $this->x = $this->origem_x/$this->x;
            } else {
                $this->x = $this->origem_x;
                $this->y = $this->origem_y;
            }     
        } else {
            if($this->origem_x > $this->t) {
                $this->x = $this->t;
                $this->y = $this->origem_x/$t;
                $this->y = $this->origem_y/$this->y;
            } else {
                $this->x = $this->origem_x;
                $this->y = $this->origem_y;
            }
        }
    
        //local logo
        //200(tamanho original) - tamanho gif+5
        $this->local = $this->y_marca + 5;
        $this->local = $this->y - $this->local;
                    
        if($this->th == 'normal') {
            //cria a img final
            $this->img_final = imagecreatetruecolor($this->x,$this->y);
        } else if ($this->th == 'thumb') {
            //cria a img final
            $this->img_final = imagecreatetruecolor($tamanho_h,$tamanho_w);
        }
        
        // fundo branco e texto azul
          $this->branco = imagecolorallocate($this->img_final, 255, 255, 255);
        $this->preto = imagecolorallocate($this->img_final, 0, 0, 0);

        //cria a imagem reduzida + a logo
        // escreve a string em cima na esquerda
        imagecopyresized($this->img_final, $this->img_origem, 0, 0, 0, 0,  $this->x, $this->y, $this->origem_x, $this->origem_y);
        if($this->imagem1) {
            imagecopymerge($this->img_final, $this->marca, 5, $this->local, 0, 0, $this->x_marca, $this->y_marca, 70);
        }
        imagestring($this->img_final, 2, 2, 2, $texto, $this->preto);
          imagestring($this->img_final, 2, 1, 1, $texto, $this->branco);
        
        //copia a imagem para o caminho pedido
        //se ext = 1 entao é gif
        if($this->ext == 1) {
            imagegif($this->img_final, "$caminho/".$this->thumbnail,100);
        }
        
        //se ext = 2 entao é jpg
        if($this->ext == 2) {
            imagejpeg($this->img_final, "$caminho/".$this->thumbnail,100);
        }
                
        //se ext = 3 entao é png    
        if($this->ext == 3) {
            imagepng($this->img_final, "$caminho/".$this->thumbnail,100);
        }
         

        //destroi
        imagedestroy($this->img_origem);
        imagedestroy($this->img_final); 
        if($this->imagem1) {
            imagedestroy($this->marca);
        }
    }
} 

bom estudo!

[CCV_Pinto]

uma questão importante é se a execução do php fica da parte do servidor ou do cliente... acho q eh do servidor...

mas esse tipo de post é enriquecedor... vamos aquecer esse fórum... e com o tempo vai vir uma galera pra cá...

abraços

[CCV_HEALbra]

kkkkkkkkkkk
pinto
apesar de ter só nos dois vamos aquecer sim
kkkk
foda viu..o povo nao se interessa ou acha q só existe comunidades do DE, silk, DOTA..

bom..pensando no futuro....nao entendi bem a sua pergunta..mas tds os códigos ficam no servidor..não?

[CCV_Soad]

opa tou entereçado em aprender programação
minha praia é rede mais
quero saber programar um poquim ;D
abraços !!