{"id":1529,"date":"2023-03-20T21:45:21","date_gmt":"2023-03-20T21:45:21","guid":{"rendered":"https:\/\/universomotero.com\/?page_id=1529"},"modified":"2025-12-06T06:00:06","modified_gmt":"2025-12-06T06:00:06","slug":"redimensioneaza-imaginea-online","status":"publish","type":"page","link":"https:\/\/universomotero.com\/ro\/redimensioneaza-imaginea-online\/","title":{"rendered":"Redimensioneaz\u0103 imaginea online"},"content":{"rendered":"<h2 class=\"wp-block-heading has-text-align-center\">Redimensioneaz\u0103 imaginea online<\/h2>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\"><strong>Instrumentul nostru online de redimensionare a imaginilor ajut\u0103 la redimensionarea imaginilor \u0219i la convertirea lor \u00een alte formate<\/strong><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<div style=\"text-align: center;\" class=\"layout\">\n<div class=\"container\">\n<div class=\"image-container\">\n<div class=\"image-preview\">\n<img decoding=\"async\" id=\"myImage\" src=\"http:\/\/universomotero.com\/wp-content\/uploads\/2023\/03\/back.png\" alt=\"Imagine redimensionat\u0103\">\n   <p id=\"originalInfo\"><\/p>\n   <\/div>\n   <div class=\"file\">\n   <input style=\"display:none;\" class=\"upload-btn\" data-text=\"Select your file!\" type=\"file\" id=\"uploadImage\" accept=\"image\/*\" onchange=\"showOriginalInfo()\">\n   <label class=\"upload-image-button upload-btn\" for=\"uploadImage\">Alege\u021bi fi\u0219ierele<\/label>\n   <\/div>\n\n   <div class=\"width-box\">\n   <label for=\"width\">L\u0103\u0163ime:<\/label>\n   <input type=\"number\" id=\"width\" name=\"width\">\n   <\/div>\n   <div class=\"height-box\">\n   <label for=\"height\">\u00cen\u0103l\u0163ime:<\/label>\n   <input type=\"number\" id=\"height\" name=\"height\">\n   <\/div>\n   <label for=\"format\">Format:<\/label>\n   <div>\n   <select id=\"format\" name=\"format\">\n   <option value=\"jpg\">JPG<\/option>\n   <option value=\"png\">PNG<\/option>\n   <option value=\"webp\">WebP<\/option>\n   <\/select>\n   <\/div>\n\n   <br>\n   <div class=\"width-box\">\n   <button id=\"resizeBtn\" onclick=\"resizeImage()\">Redimensioneaz\u0103 imaginea<\/button>\n   <a id=\"downloadBtn\" download=\"online-image-resize.jpg\" href=\"\"><button class=\"download-button\">Desc\u0103rcare<\/button><\/a>\n   <p id=\"resizedInfo\"><\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<style>\nbody {\nfont-family: system-ui, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n\nhtml,\nbody,\n.container {\nheight: 100%;\nwidth: 100%;\n}\n\n.container {\ndisplay: flex;\nflex-wrap: wrap;\njustify-content: center;\n}\n\n.width-box, .height-box{\npadding:5px;\n}\n\n.image-container {\nwidth: 100%;\nmax-width: 600px;\n\/*margin: 20px;*\/\npadding: 20px;\nborder: 1px solid #ccc;\nborder-radius: 10px;\nbox-shadow: 0px 0px 10px #ccc;\n}\n\n.image-preview {\nwidth: 100%;\nmax-width: 600px;\n}\n\nimg {\ndisplay: unset!important;\nmax-width: 100%;\nheight: auto;\nmax-width: 90%!important;\nmax-height: 220px!important;\n}\n\ninput[type=\"file\"] {\nmargin-bottom: 10px;\n}\n\nbutton {\nbackground-color: #4CAF50;\nborder: none;\ncolor: white;\npadding: 10px 20px;\ntext-align: center;\ntext-decoration: none;\ndisplay: inline-block;\nfont-size: 16px;\nmargin-bottom: 10px;\nborder-radius: 5px;\ncursor: pointer;\n}\n\n.download-button{\nbackground-color:#1289dd;\n}\n\n[type=\"file\"] + label {\nbackground: hsl(214deg 62% 46%);\nborder: none;\nborder-radius: 5px;\ncolor: #fff;\ncursor: pointer;\ndisplay: inline-block;\nfont-family: 'Rubik', sans-serif;\nfont-size: inherit;\nfont-weight: 500;\nmargin-bottom: 1rem;\noutline: none;\nposition: relative;\ntransition: all 0.3s;\nvertical-align: middle;\n}\n\n.upload-btn:hover {\nbox-shadow: 0 4px darken(#f8eae3, 10%);\ntop: 2px;\nbackground: #545b62!important;\n}\n\n.upload-image-button {\ncolor: #878787;\n}\n\n.upload-image-button {\ncolor: #fff;\ncursor: pointer;\noutline: none;\npadding: 10px 25px;\ntext-transform: uppercase;\ntransition: all 1s ease;\nmargin: 10px 0px 10px 0px;\n}\n\n.row {\ndisplay: flex;\njustify-content: space-between;\n}\n\n#originalInfo {\nfont-size:16px;\ncolor: #ec0000;\n}\n\n#resizedInfo {\nfont-size:16px;\ncolor: #008000;\n}\n\n@media screen and (max-width: 768px) {\n.container {\nflex-direction: column\n}\n<\/style>\n\n\n\n<script>\nconst img = document.getElementById(\"myImage\");\nconst upload = document.getElementById(\"uploadImage\");\nconst widthInput = document.getElementById(\"width\");\nconst heightInput = document.getElementById(\"height\");\nconst formatSelect = document.getElementById(\"format\");\nconst downloadBtn = document.getElementById(\"downloadBtn\");\nconst originalInfo = document.getElementById(\"originalInfo\");\nconst resizedInfo = document.getElementById(\"resizedInfo\");\n\nfunction showOriginalInfo() {\nconst file = upload.files[0];\nconst fileSize = Math.round(file.size \/ 1024);\nconst fileType = file.type.split(\"\/\")[1].toUpperCase();\nconst img = new Image();\nimg.src = URL.createObjectURL(file);\nimg.onload = function() {\nconst width = this.width;\nconst height = this.height;\noriginalInfo.innerHTML = `Original size: ${width} x ${height} - ${fileSize} KB (${fileType})`;\n};\n}\n\nfunction resizeImage() {\nconst currentWidth = img.clientWidth;\nconst currentHeight = img.clientHeight;\nconst desiredWidth = widthInput.value || currentWidth;\nconst desiredHeight = heightInput.value || currentHeight;\nconst format = formatSelect.value;\n\nimg.style.width = desiredWidth + \"px\";\nimg.style.height = desiredHeight + \"px\";\n\nconst canvas = document.createElement(\"canvas\");\ncanvas.width = desiredWidth;\ncanvas.height = desiredHeight;\n\nconst ctx = canvas.getContext(\"2d\");\nctx.drawImage(img, 0, 0, desiredWidth, desiredHeight);\n\nconst dataUrl = canvas.toDataURL(\"image\/\" + format);\ndownloadBtn.href = dataUrl;\ndownloadBtn.download = \"online-image-resize.\" + format;\n\ncanvas.toBlob((blob) => {\nconst url = URL.createObjectURL(blob);\nimg.src = url;\ndownloadBtn.href = url;\ndownloadBtn.download = `online-image-resize.${format}`;\nconst resizedFileSize = Math.round(blob.size \/ 1024);\nconst resizedFileType = blob.type;\nresizedInfo.innerHTML = `Resized size: ${desiredWidth} x ${desiredHeight} - ${resizedFileSize} KB`;\n}, `image\/${format}`, 1);\n}\n\nupload.addEventListener(\"change\", function() {\nconst file = upload.files[0];\nconst reader = new FileReader();\n\nreader.addEventListener(\"load\", function() {\nimg.src = reader.result;\n}, false);\n\nif (file) {\nreader.readAsDataURL(file);\n}\n});\n<\/script>\n\n\n\n<h2 class=\"wp-block-heading\">Ce este redimensionarea imaginii?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Redimensionarea imaginilor este procesul de modificare a dimensiunii, a dimensiunilor sau a rezolu\u021biei unei imagini, de obicei efectuat pentru a o potrivi \u00een diferite medii de ie\u0219ire sau pentru a reduce dimensiunea fi\u0219ierului. Este esen\u021bial s\u0103 fi\u021bi aten\u021bi la redimensionarea imaginilor, deoarece acest lucru poate afecta calitatea \u0219i claritatea acestora.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Ce este un redimensionator de imagini?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Un instrument online pentru redimensionarea imaginilor se nume\u0219te image resizer. Orice imagine, inclusiv fi\u0219iere JPG, PNG \u0219i WebP, poate fi redimensionat\u0103 cu aceast\u0103 aplica\u021bie. Func\u021bioneaz\u0103 instantaneu \u00een orice browser cu JavaScript activat \u0219i este \u00een \u00eentregime bazat pe web.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Cum s\u0103 redimensionezi o imagine online?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Redimensionarea imaginilor online este o sarcin\u0103 foarte simpl\u0103 folosind instrumentul nostru. Iat\u0103 pa\u0219ii pentru a redimensiona o imagine:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Deschide instrumentul \u0219i alege o imagine de pe telefon sau computer.<\/li>\n\n\n\n<li>Introduce\u021bi \u00een\u0103l\u021bimea \u0219i l\u0103\u021bimea noii imagini dorite.<\/li>\n\n\n\n<li>Selecta\u021bi formatul de imagine de care ave\u021bi nevoie pentru noua imagine.<\/li>\n\n\n\n<li>Face\u021bi clic pe butonul de redimensionare \u0219i previzualiza\u021bi imaginea recent redimensionat\u0103.<\/li>\n\n\n\n<li>Face\u021bi clic pe butonul de desc\u0103rcare \u0219i salva\u021bi-l pe dispozitiv.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Conform celor de mai sus, imaginea nou redimensionat\u0103 va fi salvat\u0103 pe dispozitivul dvs. Acum o pute\u021bi utiliza oriunde.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">C\u00e2te formate de imagine accept\u0103?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u00cen prezent, accept\u0103m cele trei formate de imagine cele mai populare: JPEG, PNG \u0219i WebP, care sunt utilizate pe scar\u0103 larg\u0103.<\/p>","protected":false},"excerpt":{"rendered":"<p>Online Image Resize Our online image resize tool helps to resize images and also convert them to other formats Choose files Width: Height: Format: JPGPNGWebP Resize Image Download What Is Image Resizing? Image resizing is the process of changing an image&#8217;s size, dimensions, or resolution, typically done to fit it into different output mediums or [&hellip;]<\/p>","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1529","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/pages\/1529","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/comments?post=1529"}],"version-history":[{"count":1,"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/pages\/1529\/revisions"}],"predecessor-version":[{"id":2327,"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/pages\/1529\/revisions\/2327"}],"wp:attachment":[{"href":"https:\/\/universomotero.com\/ro\/wp-json\/wp\/v2\/media?parent=1529"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}