Görüntüleri bir img etiketine atamadan önce javascript ile yeniden boyutlandırma

Question

HTML ve CSS geliştirmede çok yeni yaşıyorum.

img etiketli bir HTML sayfam var. Bu etiket bazı görüntüler tutacaktır. Bu görüntüler farklı boyutlarda. CSS kullanarak img etiketine genişlik ve yükseklik ayarlıyorum.

Tüm resimler JavaScript kullanılarak gösterilecektir.

Görüntüyü IMG etiketine atamadan önce JavaScript ile resimleri yeniden boyutlandırmam gerekebilir mi? Belki de bunu yapmak zorunda değilim çünkü CSS kullanarak IMG boyutunu ayarladım. Oranlar sınırlandırılacak mı?

İngilizcem için özür dilerim.

Answer 1

Css kullanarak hem yükseklik hem de genişlik ayarladıysanız en boy oranı korunmaz. Ancak, html img etiketini kullanarak özelliklerden birini belirtirseniz, en boy oranı korunur.

Answer 2

Bunu sunucu tarafında yapmalısınız. Bir yönetim betiği ile. Yüklendiğinde orijinal görüntünün sürümlerini oluşturabilir, daha sonra bu görüntüler HTML/CSS tarafı tarafından güvenle kullanılabilir.

Bu, istemci tarafında yapılacak bir işlem değildir. Temel olarak burada yaptığınız şey, daha büyük bir görüntü (çok fazla veri) indirmek ve daha küçük bir görüntü oluşturmak için aşağı çekmek. Yani, istemcinin bant genişliğini ve sunucunun bant genişliğini harcıyorsunuz.

orada kesinlikle hiçbir ther olasılık ve o zaman ile ascpect oranını koruyarak ile ilkel kırpma acieve edebilir, 640x480 söylemek sabit bir alan varsa aşağıdaki:

HTML:

<div id="wrapper"><img src="my.jpg"></div> 

CSS:

#wrapper { 
    width: 640px; 
    height: 480px; 
    line-height: 480px; 
} 

#wrapper img { 
    width: 640px; 
}