Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Michel Kuguio

[Resolvido] onde ta o erro?

Por , em Javascript

Recommended Posts

Michel Kuguio    3

Michel Kuguio
Postado

não sie pq não ta pegando os valores de altura e largura nos inputs

<!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>Untitled Document</title>
</head>
<link rel="stylesheet" type="text/css" href="../js/imgareaselect/css/imgareaselect-default.css" />
 <script type="text/javascript" src="../js/jquery.js"></script>
 <script type="text/javascript" src="../js/imgareaselect/scripts/jquery.imgareaselect.pack.js"></script>
<script type="text/javascript">




function preview(img, selection) {

var X_largura = $("input[name=y_altura]").val();
var Y_altura = $("input[name=y_altura]").val();
var Caminho_Imagem = $("input[name = imagemCaminho]").val();

   var scaleX = 100 / (selection.width || 1);
   var scaleY = 100 / (selection.height || 1);

   $('#ferret + div > img').css({
       width: Math.round(scaleX * X_largura) + 'px',
       height: Math.round(scaleY * Y_altura) + 'px',
       marginLeft: '-' + Math.round(scaleX * selection.x1) + 'px',
       marginTop: '-' + Math.round(scaleY * selection.y1) + 'px'
   });
}

$(function () {
   $('<div><img src="').Caminho_Imagem.('" /></div>')
       .css({
           float: 'left',
           position: 'relative',
           overflow: 'hidden',
           width: '100px',
           height: '100px'
       })
       .insertAfter($('#ferret'));

   $('#ferret').imgAreaSelect({ aspectRatio: '1:1', onSelectChange: preview });

   $('#ferret').imgAreaSelect({ 
       onSelectEnd: function (img, selection) {
           $('input[name="x1"]').val(selection.x1);
           $('input[name="y1"]').val(selection.y1);
           $('input[name="x2"]').val(selection.x2);
           $('input[name="y2"]').val(selection.y2);
       }
   });
});


</script>
<body>
<?php
$imagemNome = 'clienteid_9_7b0bd8e212a1ecd83493e6262cfebcd3.jpg';
$imagemTipo = 'logo';



if($imagemTipo == 'imagem'){
	//imagem
		$PastaMaior = '../Uploads/Clientes/album/Grande';
		$PastaMenor = '../Uploads/Clientes/album/Miniatura';
		$PastaBKP='../Uploads/Clientes/album/BKP';
}elseif($imagemTipo == 'logo'){
	//logo
		$PastaMaior = '../Uploads/Clientes/logo/Logo';
		$PastaMenor = '../Uploads/Clientes/logo/Miniatura';
		$PastaMed = '../Uploads/Clientes/logo/Medio';
		$PastaBKP = '../../Uploads/Clientes/logo/BKP';
}elseif($imagemTipo == 'top'){
	//top
		$PastaMaior = '../Uploads/Clientes/destaque/banner_top';
		$PastaBKP = '../Uploads/Clientes/destaque/banner_BKPtop';

}elseif($imagemTipo == 'center'){
	//center
		$PastaBKP = '../Uploads/Clientes/destaque/banner_BKPcenter';
		$PastaMaior = '../Uploads/Clientes/destaque/banner_center';
}

$imagemCaminho = $PastaBKP.'/'.$imagemNome;		
$img = imagecreatefromjpeg($imagemCaminho);
$x_largura = imagesx($img);
$y_altura = imagesy($img);
imagedestroy($img);			










?>
<form action="http://localhost/eventosribeiraov4/adm/sistema/edicao.php" method="post"  enctype="multipart/form-data" >
  <input id="imagemNome" type="text" name="imagemNome" value="<?php echo $imagemNome;?>"  />
  <input id="imagemCaminho" type="text" name="imagemCaminho" value="<?php echo $imagemCaminho;?>" />
  <input id="x_largura" type="text" name="x_largura" value="<?php echo $x_largura;?>" />
  <input id="y_altura" type="text" name="x_altura" value="<?php echo $y_altura;?>" />
  <input id="x1" type="text" name="x1" value="" />
  <input id="y1" type="text" name="y1" value="" />
  <input id="x2" type="text" name="x2" value="" />
  <input id="y2" type="text" name="y2" value="" />
  <input type="submit" name="submit" value="Submit" />
 </form>

<img src='<?php echo $imagemCaminho;?>' id="ferret" />

</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Michel Kuguio    3

Michel Kuguio
Postado

consegui.. xD

 

<!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>Untitled Document</title>
</head>
<link rel="stylesheet" type="text/css" href="../js/imgareaselect/css/imgareaselect-default.css" />
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/imgareaselect/scripts/jquery.imgareaselect.pack.js"></script>
<script type="text/javascript">




$(document).ready(function () {function preview(img, selection) {

var X_largura = $("input[name=x_largura]").val();
var Y_altura = $("input[name=y_altura]").val();


   var scaleX = 100 / (selection.width || 1);
   var scaleY = 100 / (selection.height || 1);

   $('#ferret + div > img').css({
       width: Math.round(scaleX * X_largura) + 'px',
       height: Math.round(scaleY * Y_altura) + 'px',
       marginLeft: '-' + Math.round(scaleX * selection.x1) + 'px',
       marginTop: '-' + Math.round(scaleY * selection.y1) + 'px'
   });
}

$(function () {
 var Caminho_Imagem = $("input[name = imagemCaminho]").val();
   $('<div><img src="'+Caminho_Imagem+'" /></div>')
       .css({
           float: 'left',
           position: 'relative',
           overflow: 'hidden',
           width: '100px',
           height: '100px'
       })
       .insertAfter($('#ferret'));


   $('#ferret').imgAreaSelect({ 
       onSelectChange: preview,
	handles: true,
	aspectRatio: '1:1', 
	onSelectEnd: function (img, selection) {
           $('input[name="x1"]').val(selection.x1);
           $('input[name="y1"]').val(selection.y1);
           $('input[name="x2"]').val(selection.x2);
           $('input[name="y2"]').val(selection.y2);
       }

   });
});
});

</script>
<body>
<?php
$imagemNome = 'clienteid_9_7b0bd8e212a1ecd83493e6262cfebcd3.jpg';
$imagemTipo = 'logo';



if($imagemTipo == 'imagem'){
	//imagem
		$PastaMaior = '../Uploads/Clientes/album/Grande';
		$PastaMenor = '../Uploads/Clientes/album/Miniatura';
		$PastaBKP='../Uploads/Clientes/album/BKP';
}elseif($imagemTipo == 'logo'){
	//logo
		$PastaMaior = '../Uploads/Clientes/logo/Logo';
		$PastaMenor = '../Uploads/Clientes/logo/Miniatura';
		$PastaMed = '../Uploads/Clientes/logo/Medio';
		$PastaBKP = '../../Uploads/Clientes/logo/BKP';
}elseif($imagemTipo == 'top'){
	//top
		$PastaMaior = '../Uploads/Clientes/destaque/banner_top';
		$PastaBKP = '../Uploads/Clientes/destaque/banner_BKPtop';

}elseif($imagemTipo == 'center'){
	//center
		$PastaBKP = '../Uploads/Clientes/destaque/banner_BKPcenter';
		$PastaMaior = '../Uploads/Clientes/destaque/banner_center';
}

$imagemCaminho = $PastaBKP.'/'.$imagemNome;		
$img = imagecreatefromjpeg($imagemCaminho);
$x_largura = imagesx($img);
$y_altura = imagesy($img);
imagedestroy($img);			










?>


<img src='<?php echo $imagemCaminho;?>' id="ferret" />
<form action="http://localhost/eventosribeiraov4/adm/sistema/edicao.php" method="post"  enctype="multipart/form-data" >
  <input id="imagemNome" type="text" name="imagemNome" value="<?php echo $imagemNome;?>"  />
  <input id="imagemCaminho" type="text" name="imagemCaminho" value="<?php echo $imagemCaminho;?>" />
  <input id="x_largura" type="text" name="x_largura" value="<?php echo $x_largura;?>" />
  <input id="y_altura" type="text" name="x_altura" value="<?php echo $y_altura;?>" />
  <input id="x1" type="text" name="x1" value="" />
  <input id="y1" type="text" name="y1" value="" />
  <input id="x2" type="text" name="x2" value="" />
  <input id="y2" type="text" name="y2" value="" />
  <input type="submit" name="submit" value="Submit" />
 </form>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito