[Ajax][ط·ط±ظٹظ‚ط©] طھظ„ظˆظٹظ† ط§ظ„طµظˆط±ظ‡ ط¹ظ†ط¯ ظ…ط±ظˆط± ط§ظ„ظ…ط§ظˆط³ ط¨ظ‡ط§.


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

الكود code اليوم هو Js جافا سكربت .. , طبعاً اللي راح نشرح طريقةه اليوم , هو طريقة تلوين الصوره عند مرور الماوس بها ...
مثل ماهو موجود هنا http://phpx3.com/drs/index.html .

أول شئ ... الكود code , تضعه في الـ head بالصفحة بين <head> و </head> :
رمز PHP:
<code style="white-space:nowrap"> <code> &#91;size=2&#93;<SCRIPT language="JavaScript1.2"> &#91;/size&#93;



&#91;size=2&#93;<!-- Script courtesy of http://www.web-source.net - Your Guide to Professional Web Site Design and Development &#91;/size&#93;
&#91;size=2&#93;function makevisible(cur,which){ &#91;/size&#93;
&#91;size=2&#93;strength=(which==0)? 1 : 0.2 &#91;/size&#93;
&#91;size=2&#93;if (cur.style.MozOpacity) &#91;/size&#93;
&#91;size=2&#93;cur.style.MozOpacity=strength &#91;/size&#93;
&#91;size=2&#93;else if (cur.filters) &#91;/size&#93;
&#91;size=2&#93;cur.filters.alpha.opacity=strength*100 &#91;/size&#93;
&#91;size=2&#93;} &#91;/size&#93;
&#91;size=2&#93;// --> &#91;/size&#93;
&#91;size=2&#93;</SCRIPT> &#91;/size&#93;
&#91;size=2&#93;&#91;/size&#93;
</code> </code>


بعد وضع الكود code في صفحتك ... قم بالذهاب لصورتك , والتي غالباً سيكون الكود code الخاص بها هكذا :

رمز PHP:
<code style="white-space:nowrap"> <code> &#91;size=2&#93;<img src="http://phpx3.com/images/center.gif" border="0"> &#91;/size&#93;
&#91;size=2&#93;&#91;/size&#93;
</code> </code>

ثم قم بعد ذلك بوضع هذا الكود code داخل وسم الصوره :

رمز PHP:
<code style="white-space:nowrap"> <code> &#91;size=2&#93;style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" &#91;/size&#93;
&#91;size=2&#93;&#91;/size&#93;
</code> </code>

ليصبح كود code صورتك هكذا :


رمز PHP:
<code style="white-space:nowrap"> <code> &#91;size=2&#93;<img src="http://phpx3.com" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"> &#91;/size&#93;
&#91;size=2&#93;&#91;/size&#93;
</code> </code>



انتهى الدرس مفصل ...
وشكراً.








©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©