كود Html تكبير الصورة بمرور الماوس عليها photo zoom code

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

قدمت من قبل طريقة لتكبير الصور بطريقة جميلة بإستخدام أكواد CSS
واليوم أقدم كود Html   لتكبير الصور للمواقع والمدونات والمنتديات
بمرور مؤشر الماوس عليها تزيد مساحة الصورة لتصبح أكثر وضوحا
image hover zoom effect

 يمكنك تمرير الماوس على الصورة التالية لتجربة الكود

 

طريقة تركيب الكود لمدونات بلوجر:

رفع الصور بروابط مباشرة يمكنك الرفع من هــناااااا

هذا الكود يتم تطبيقه داخل الموضوع بمعنى أثناء تحرير الموضوع إنتقل إلى جهة تحرير HTML

ثم أضع رابط الصورة بداخل هذا الكود

<center>
<image src="رابط الصورة" onmouseover="this.height='300';this.width='300'" 
onmouseout="this.height='200';this.width='200'"
height="200" width="200">
<center>
<center>
<a href="http://conda3ianllkhir.blogspot.com/"><img alt="Blogger widget" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT61IL7cDq0PavKjR0boorRHD1Cb8mdC-yIxym2TGcDv7SzEKXwaDFrDZMoRWxM41HONz0zdx3cVtAHTfZR84_SLxZmUy3A28fITUy6uaKnGREKhkgGNAXmAvJIhH1quJApq8kNjCTWS4b/s89/%25D8%25A8%25D8%25A7%25D8%25AF%25D8%25AC%2520%25D8%25A7%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9%2520%25D9%2584%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.png" title="Blogger widget" /></a>
<center></center></center>

تابع أيضا طرق أرشفة الصور بمدونات بلوجر

تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا  

بقلم Dr.Rasha Omran

مطورة تطبيقات الهاتف ، سفيرة ببرنامج Women Techmakers التابع لجوجل ، أهتم بالمحتوى الرقمى وأحببت أن أدون كل ما تعلمته فى هذا الموقع للإفادة فى أعمال هادفة