Descriere: Redimensionare imagini 2
Download:
Autor: Anonim
Sursa (Link-ul oficial): Propria parere: Folositor.
Tutorialul:
Recent am avut nevoie in forum sa redimensionez automat pozele puse de membrii in discutiile din forum. Mai jos gasiti scriptul javascript care face acest lucru.
Ideea de baza este urmatoarea:
- Toate pozele din pagina ce trebuiesc redimensionate au atributul name="forum_img"
- Scriptul se incarca in header-ul pagini iar pentru apelare am facut apel la functia de redimensionare la sfarsitul generarii forumului
- exemplu concret il gasiti Aici
Cod: Selectaţi tot
<script language="javascript" type="text/javascript">
function redimensionare_imagini() {
// se preiau pozele din pagina
var info = document.images;
// se verifica cate sunt in total
var total = info.length;
// se ia fiecare imagine in parte si se verifica
for(i=0;i<total;i++) {
// se preia numele imagini
var nume = document.images[i].name;
// daca numele corespunde cu cel din forum
if ( nume == 'forum_img' ) {
// se preiau dimensiunile pozei originale
var originalH = document.images[i].height;
var originalW = document.images[i].width;
var sursa = document.images[i].src;
//var bordura = document.images[i].border;
//var alt = document.images[i].alt;
// se calculeaza ratia pozei
var ratio = originalH / originalW;
// setam valorile maxime
var maxH = 300;
var maxW = 300;
// setam noile valori ale pozei
var newH = maxH;
var newW = maxW;
var newB = 0;
if ( originalW >= maxW && ratio <= 1) {
newW = maxW;
newH = Math.round(newW * ratio);
newB = 1;
}
else if ( originalH >= maxH) {
newH = maxH;
newW = Math.round(newH / ratio);
newB = 1;
}
else if ( originalW <= maxW && originalH <= maxH ) {
newH = originalH;
newW = originalW;
}
// schimbam dimensiunile la poza
document.images[i].height = newH;
document.images[i].width = newW;
document.images[i].border = newB;
// optional se afiseaza un raport in pagina intr-un div cu id text
//var text = document.getElementById("text").innerHTML;
//document.getElementById("text").innerHTML =
// (text+'<br />sursa: '+sursa+' - inaltime: '+newH+' - latime: '+newW+' - nume: '+nume);
}
}
}
</script>