09-17-2012, 08:29 AM
|
المشاركة رقم: 1
|
المعلومات |
الكاتب: |
|
اللقب: |
Senior Member |
الرتبة |
|
البيانات |
التسجيل: |
Jul 2012 |
العضوية: |
3057 |
المشاركات: |
149 [+] |
بمعدل : |
0.03 يوميا |
اخر زياره : |
[+] |
الإتصالات |
الحالة: |
|
وسائل الإتصال: |
|
|
المنتدى :
لغـــــــات البرمجــــــــه - Programming
كيفية تصغير الصورة وتكبيرها من خلال الجيكوري 2012 , 2013
كيفية, تصغير, الصورة, وتكبيرها ,من, خلال, الجيكوري, 2012 , 2013
السلام عليكم ورحمة الله وبركاته
الصفحة كاملة
كود PHP:
<head> <title>تصغير وتكبير الصورة</title> </head> <script src="jquery.js" type="text/javascript" ></script> <script type="text/javascript">
$(document).ready(function(){
$('img').click(function(){ $(this).css({'width': '400px', 'height':'400px' , 'border' :'8px solid #EEEEEE' }); $(this).fadeOut(500).fadeIn(500); });
$('img').dblclick(function(){ $(this).css({'width': '100px', 'height':'100px'}); $(this).fadeOut(500).fadeIn(500);
}); }); </script>
<body>
<img src="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash3/543391_378833415483359_100000701104653_1172193_480294874_n.jpg" width="100" height="100" /> </body>
</html>
احنا وضع صورة وهذا رابطها
كود PHP:
http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash3/543391_378833415483359_100000701104653_1172193_480294874_n.jpg
من خلال الجيكوري راحيين نتحكم بي css
عملنا فنيكشن الاول كلك اي عند النقر على الصورة سوف تكبر
كود PHP:
$('img').click(function(){ $(this).css({'width': '400px', 'height':'400px' , 'border' :'8px solid #EEEEEE' }); $(this).fadeOut(500).fadeIn(500); });
قلنا this اي الصورة ثم عملنا لها css ووضعنا ابعاد الصورة طول 400 عرض 400 وعملنا لها ايطار
الفنيكشن الثاني استخدما دبل كلك اي عندما ينقر عليها مرتين تصغر الصورة
كود PHP:
$('img').dblclick(function(){ $(this).css({'width': '100px', 'height':'100px'}); $(this).fadeOut(500).fadeIn(500);
});
بخصوص
معناه عندما يتم النقر على الصورة نفذ الاكواد
كود PHP:
$(this).css({'width': '400px', 'height':'400px' , 'border' :'8px solid #EEEEEE' }); $(this).fadeOut(500).fadeIn(500);
وطبعا علمنا حركة فلاش عندما تكبر الصورة وميض
وهكذا بالنسبة للفنيكشن الثاني
اتمنى لكم التوفيق
|
|
|