تغییر اندازه تصاویر به شیوه خاص

[com.mohsen]

با سلام
بنده یک سری عکس با سایز های مختلف دارم و می خواهم در سایتم قرار دهم
می خواهم طوری کدهای سایت را بنویسم که نیازی به تغیر سایز عکس به صورت دستی نباشد و به طور اتوماتیک اگر width عکس بزرگتر از 400 پیکسل بود width عکس را 400 پیکسل قرار دهد و به همان نسبت height را کوچک کند و اگر width عکس کمتر از 400 پیکسل بود همان عکس را بدون تغییر قرار دهد.

مثلا دو عکس داریم
یکیwidth=50 و height=100
و دیگری width=800 و height=1000
عکس اول باید بدون تغییر باشد و عکس دوم width باید 400 شود و height آن باید 500 شود

[Saber Mogaddas]

سلام
از دستورات height,width به صورت min-height , max-width استفاده کنید که در این صورت تفاوتی بین عکس بزرگ و کوچک نخواهد بود به جز اینکه عکس کوچک عرضش ثابت ولی طولش 500 خواهد شد :

img
{
max-width: 400px;
min-height: 500px;
}

ولی برای اینکار بهتر هست که شما طول عرض رو چه بزرگ و چه کوچک مساوی با 400*500 قرار بدهید..
با کد جاوااسکریپت و یا jquery نیز امکان پذیر هست و لی باید ابتدا عکس وارد شده رو توسط تابع فراخوانی کنید و بعد طول و عرض عکس رو پیدا کنید (http://stackoverflow.com/questions/4773322/get-image-width-height)و نسبت به بزرگی و کوچکی به آن استایل بدید ..اینجام منبع (http://atomicrobotdesign.com/blog/web-development/height-and-width-of-an-image-with-jquery/) خوبی هست که طول و عرض تصویر رو پیدا کنید البته توسط jquery و بعد با یه دستور if ساده طول عرض رو با طول عرض خودتون مقایسه کنید و با دستور ()css طول و عرض رو برای تگ img تنظیم کنید..
موفق باشید..