منتدى الابداع العربي

للإبداع لمسات ! ... ولمسـات الإبــداع إختصاصـنا !
 
الرئيسيةالرئيسية  المنشوراتالمنشورات  البوابةالبوابة  التسجيلالتسجيل  دخولدخول  


كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها
 

 كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها

اذهب الى الأسفل 
انتقل الى الصفحة : الصفحة السابقة  1, 2
كاتب الموضوعرسالة
زائر
زائر
avatar


كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالسبت سبتمبر 05, 2015 2:07 am

تذكير بمساهمة فاتح الموضوع :

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها

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

كود css يوضع بورقة css تعمل على الاتي :

التحكم بحجم الصور الكبيرة بجعلها لا تزيد عن مقاس معين حفظ على مظهر الموضوع وعدم تشوة

عمل تاثير على الصور بإزاحة على اليسار او اليمين او تحت او فوق حسب الامر الذي تعطية بالكود

صورة لعمل الكود

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 2i8kpyq

https://2img.net/h/oi57.tinypic.com/2i8kpyq.gif

واجهة الابداع حجمها اكثر من 600 بيكسل لذا فهي تصغر تلقائي بالاضافة لعمل تاثير وهو الحركة نحو اليسار بانسيابية

الكود


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

/*SIDEPAN*/
.postbody img {
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
     -moz-transition: margin 1s ease;
       -o-transition: margin 1s ease;
      -ms-transition: margin 1s ease;
          transition: margin 1s ease;
}

.postbody img:hover {
  margin-left: -10px;
}

الكود من برمجتي وتعديلي فارجوا حفظ المصدر عند النقل

العناصر القابله للتغيير

600px
اقصى حجم للصور القابله للتصغير
margin-left: -10px;
اتجاه الحركة ومقياس المسافة التي يتحرك فيها الصورة

كود الحركة للاعلى

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

/*VERTPAN*/
.postbody img {
  margin-top: 0px;
  -webkit-transition: margin 1s ease;
    -moz-transition: margin 1s ease;
      -o-transition: margin 1s ease;
      -ms-transition: margin 1s ease;
          transition: margin 1s ease;
}

.postbody img:hover {
  margin-top: -20px;
}





دمتم بخير


عدل سابقا من قبل JAR7 في السبت سبتمبر 05, 2015 2:22 am عدل 1 مرات
الرجوع الى أعلى الصفحة اذهب الى الأسفل

كاتب الموضوعرسالة
زائر
زائر



كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالسبت أغسطس 27, 2016 11:14 pm

منور الموضوع
الرجوع الى أعلى الصفحة اذهب الى الأسفل
زائر
زائر



كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالخميس سبتمبر 15, 2016 12:33 am

شكرااا

كود رائع
الرجوع الى أعلى الصفحة اذهب الى الأسفل
JoryAbdallah
سوبر الإبداع 

JoryAbdallah

انثى
السمك
عدد المساهمات : 126400
نقاط النشاط : 142117
السٌّمعَة : 3006
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Saudi-10
العمر : 35

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالأحد يناير 29, 2017 12:45 am

#تقنية_تكويد
#تعلم_تكويد
#برمجه_احلى_منتدى
#طور_منتداك
يعطيك العافية على العطاء
 واصل تالقك


كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Img_2010
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://taqnyiat.ahlamontada.com/
El Desha El Hlawany1
عضو خبير 

El Desha El Hlawany1

ذكر
القوس
عدد المساهمات : 778
نقاط النشاط : 900
السٌّمعَة : 51
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Egypt10
العمر : 24

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالإثنين يناير 30, 2017 12:36 pm


شكر جزيلا للطرح القيم

ننتظر المزيد من ابداع مواضيعك الرائعة
تحياتي
وتقديري لك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://egyptian-cafe.123.st/
منصورة
سوبر الإبداع 

منصورة

انثى
الدلو
عدد المساهمات : 13970
نقاط النشاط : 16963
السٌّمعَة : 51
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Algeri10
العمر : 58

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالإثنين يناير 30, 2017 3:31 pm

كود مميز شكرا


كل القلوب إلى الحبيب تميل
ومعي بهذا شاهد ودليل
اما الدليل إذا ذكرت محمداً
صارت دموع العارفين تسيل
هذا رسول الله نبراس الهدى
هذا لكل العالمين نبيا
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.manssora.com/
OuSsaMa BeDdAi
سوبر الإبداع 

OuSsaMa BeDdAi

ذكر
السمك
عدد المساهمات : 23700
نقاط النشاط : 24603
السٌّمعَة : 133
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Algeri10
العمر : 20

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالجمعة فبراير 17, 2017 2:51 pm

يعطيك العافية


كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 222310
If the plan doesn’t work, change the plan, but never the goal
وردة حمراء
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://www.pubarab.com/
Picasso-Des
سوبر الإبداع 

Picasso-Des

ذكر
الجدي
عدد المساهمات : 10775
نقاط النشاط : 11119
السٌّمعَة : 136
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Ioao10
العمر : 37

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالسبت يونيو 16, 2018 11:30 pm

يعطيكم العافية على الطرح كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 837876428
كل الاحترام كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 433646733
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://medialive.pro
مصطفى ستيتان
عضو محترف 

مصطفى ستيتان

ذكر
عدد المساهمات : 1130
نقاط النشاط : 1203
السٌّمعَة : 11
بلد العضو : كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Ioao10

كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Empty
مُساهمةموضوع: رد: كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها   كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Emptyالإثنين يوليو 23, 2018 9:40 am

   جزاكم الله خيراً  
 وردة حمراء وردة حمراء وردة حمراء وردة حمراء 


سبحان الله والحمدلله ولا إله إلا الله 
 
كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها - صفحة 2 Do
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://www.elmanal.com
 
كود css التحكم بحجم الصور بالمواضيع وعمل تاثير حركة عليها
الرجوع الى أعلى الصفحة 
صفحة 2 من اصل 2انتقل الى الصفحة : الصفحة السابقة  1, 2

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتدى الابداع العربي ::  تقنيات احلى منتدى ::  تقنيات أحلى منتدى :: التقنيات المتقدمة-
انتقل الى:  
جميع الحقوق محفوظة لمنتدى الإبداع العربي 2020