كود css التحكم بحجم الصور الكبيرة ,اضافة تاثير تكبير وتصغير على الصورة

كود css التحكم بحجم الصور الكبيرة ,اضافة تاثير تكبير وتصغير على الصورة

السلام عليكم ورحمة الله الكود سهل التعديل

عبارة عن التحكم بحجم الصور الكبيرة وعدم تجاوزها حد معين او مقياس معين دون التاثير بحجم الصور الصغيرة

بالاضافة لعمل حركة زووم أي تكبير للصورة او تصغير للصورة

اول حركة التكبير



الكود

الكود:

.postbody img { 
    max-width: 500px; 
    /* Resize the image for IE6 */ 
    width: expression(this.width > 500 ? 500: true); 
}  

/*GROW*/
.postbody img {
 
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}

.postbody img:hover {
   max-width: 600px; 
    /* Resize the image for IE6 */ 
    width: expression(this.width > 600 ? 600: true); 
}  


ثاني حركة التصغير






الكود

الكود:

.postbody img { 
    max-width: 600px; 
    /* Resize the image for IE6 */ 
    width: expression(this.width > 600 ? 600: true); 
}  

/*GROW*/
.postbody img {
 
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}

.postbody img:hover {
   max-width: 500px; 
    /* Resize the image for IE6 */ 
    width: expression(this.width > 500 ? 500: true); 
}  



تغيير رقمي 600 و 500
حسب ماترونه مناسب


دمتم بخير