我开发了这个脚本来通过单击按钮来旋转图像......
问题
它旋转得很好,但问题是,一旦图像旋转 90 度或 270 度,它就不再适合主容器......
我希望它旋转 90/270 度后就能与容器配合。
$(document).ready(function() {
var degrees = 0;
$("button").click(function rotateMe(e) {
degrees += 90;
//$('.img').addClass('rotated'); // for one time rotation
$(".content").css({
'transform': 'rotate(' + degrees + 'deg)',
'-ms-transform': 'rotate(' + degrees + 'deg)',
'-moz-transform': 'rotate(' + degrees + 'deg)',
'-webkit-transform': 'rotate(' + degrees + 'deg)',
'-o-transform': 'rotate(' + degrees + 'deg)'
});
})
});Run Code Online (Sandbox Code Playgroud)
.rotated {
transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
}
.img {
transition: all 0.5s …Run Code Online (Sandbox Code Playgroud)我正在使用此 php 代码将图像从电脑上传到服务器
$ImageToLoad=mysql_real_escape_string($_POST['image_attached']);
if($ImageToLoad){
$token=$token;//variable
$ImageToLoad = str_replace('data:image/png;base64,', '', $ImageToLoad);
$ImageToLoad = str_replace('data:image/jpeg;base64,', '', $ImageToLoad);
$ImageToLoad = str_replace(' ', '+', $ImageToLoad);
$fileData = base64_decode($ImageToLoad);
$destino_path="/images/$token/image.png";
file_put_contents($destino_path, $fileData);
}
Run Code Online (Sandbox Code Playgroud)
工作正常。
问题
我需要知道如何在将图像存储在服务器之前调整其大小/裁剪它们。否则它会保持相同的大小(巨大图像时出现问题)