أزرار css3 لمدونات بلوجر


السلام عليكم ورحمة الله
معنا اليوم مجموعة أزرار جذابة وكيفية استدعائها داخل التدوينة
من دون اطالة انتقل الى تحرير القالب وقم بتوسيع قوالب عناصر واجهة المستخدم 
ثم ابحث عن     ]]></b:skin>  باستخدام CTRL+F  وضع الكود التالي قبله مباشرة كود ال CSS








 /* button
---------------------------------------------- */
.button {
    display: inline-block;
    zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
    *display: inline;
    vertical-align: baseline;
    margin: 0 2px;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: 14px/100% Arial, Helvetica, sans-serif;
    padding: .5em 2em .55em;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
    text-decoration: none;
}
.button:active {
    position: relative;
    top: 1px;
}

.bigrounded {
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
}
.medium {
    font-size: 12px;
    padding: .4em 1.5em .42em;
}
.small {
    font-size: 11px;
    padding: .2em 1em .275em;
}

/* color styles
---------------------------------------------- */

/* black */
.black {
    color: #d7d7d7;
    border: solid 1px #333;
    background: #333;
    background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
    background: -moz-linear-gradient(top,  #666,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}
.black:hover {
    background: #000;
    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
    background: -moz-linear-gradient(top,  #444,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}
.black:active {
    color: #666;
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#444));
    background: -moz-linear-gradient(top,  #000,  #444);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#666666');
}

/* gray */
.gray {
    color: #e9e9e9;
    border: solid 1px #555;
    background: #6e6e6e;
    background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
    background: -moz-linear-gradient(top,  #888,  #575757);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
    background: #616161;
    background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
    background: -moz-linear-gradient(top,  #757575,  #4b4b4b);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
    color: #afafaf;
    background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
    background: -moz-linear-gradient(top,  #575757,  #888);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

/* white */
.white {
    color: #606060;
    border: solid 1px #b7b7b7;
    background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background: -moz-linear-gradient(top,  #fff,  #ededed);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.white:hover {
    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
    background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.white:active {
    color: #999;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
    background: -moz-linear-gradient(top,  #ededed,  #fff);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* orange */
.orange {
    color: #fef4e9;
    border: solid 1px #da7c0c;
    background: #f78d1d;
    background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
    background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.orange:hover {
    background: #f47c20;
    background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
    background: -moz-linear-gradient(top,  #f88e11,  #f06015);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.orange:active {
    color: #fcd3a5;
    background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
    background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* red */
.red {
    color: #faddde;
    border: solid 1px #980c10;
    background: #d81b21;
    background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
    background: -moz-linear-gradient(top,  #ed1c24,  #aa1317);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}
.red:hover {
    background: #b61318;
    background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
    background: -moz-linear-gradient(top,  #c9151b,  #a11115);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}
.red:active {
    color: #de898c;
    background: -webkit-gradient(linear, left top, left bottom, from(#aa1317), to(#ed1c24));
    background: -moz-linear-gradient(top,  #aa1317,  #ed1c24);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa1317', endColorstr='#ed1c24');
}

/* blue */
.blue {
    color: #d9eef7;
    border: solid 1px #0076a3;
    background: #0095cd;
    background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
    background: -moz-linear-gradient(top,  #00adee,  #0078a5);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}
.blue:hover {
    background: #007ead;
    background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
    background: -moz-linear-gradient(top,  #0095cc,  #00678e);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}
.blue:active {
    color: #80bed6;
    background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
    background: -moz-linear-gradient(top,  #0078a5,  #00adee);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

/* rosy */
.rosy {
    color: #fae7e9;
    border: solid 1px #b73948;
    background: #da5867;
    background: -webkit-gradient(linear, left top, left bottom, from(#f16c7c), to(#bf404f));
    background: -moz-linear-gradient(top,  #f16c7c,  #bf404f);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c', endColorstr='#bf404f');
}
.rosy:hover {
    background: #ba4b58;
    background: -webkit-gradient(linear, left top, left bottom, from(#cf5d6a), to(#a53845));
    background: -moz-linear-gradient(top,  #cf5d6a,  #a53845);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a', endColorstr='#a53845');
}
.rosy:active {
    color: #dca4ab;
    background: -webkit-gradient(linear, left top, left bottom, from(#bf404f), to(#f16c7c));
    background: -moz-linear-gradient(top,  #bf404f,  #f16c7c);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f', endColorstr='#f16c7c');
}

/* green */
.green {
    color: #e8f0de;
    border: solid 1px #538312;
    background: #64991e;
    background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
    background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
    background: #538018;
    background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
    background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.green:active {
    color: #a9c08c;
    background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
    background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

/* pink */
.pink {
    color: #feeef5;
    border: solid 1px #d2729e;
    background: #f895c2;
    background: -webkit-gradient(linear, left top, left bottom, from(#feb1d3), to(#f171ab));
    background: -moz-linear-gradient(top,  #feb1d3,  #f171ab);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#feb1d3', endColorstr='#f171ab');
}
.pink:hover {
    background: #d57ea5;
    background: -webkit-gradient(linear, left top, left bottom, from(#f4aacb), to(#e86ca4));
    background: -moz-linear-gradient(top,  #f4aacb,  #e86ca4);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4aacb', endColorstr='#e86ca4');
}
.pink:active {
    color: #f3c3d9;
    background: -webkit-gradient(linear, left top, left bottom, from(#f171ab), to(#feb1d3));
    background: -moz-linear-gradient(top,  #f171ab,  #feb1d3);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f171ab', endColorstr='#feb1d3');
}




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









<a class="button black" href="الرابط">demo</a>
<a class="button gray" href="الرابط">demo</a>
<a class="button white" href="الرابط">demo</a>
<a class="button orange" href="
الرابط">demo</a>
<a class="button red" href="
الرابط">demo</a>
<a class="button blue" href="
الرابط">demo</a>
<a class="button rosy" href="
الرابط">demo</a>
<a class="button pink" href="
الرابط">demo</a>
<a class="button green" href="
الرابط">demo</a>






ولاستدعاء زر واحد يكفي هذا الكود


 <a class="button black" href="الرابط">تحميل</a>


 غير عبارة black  الى اللون الذي تريد ولا تنسى الرابط  و عبارة تحميل قم بتغييرها الى مايناسبك


 ولمعاينة الأزرار مباشرة انتقل الى محرر html



html editor



واطبع الاكواد في مكانها المحدد ثم انقر على الزر استعرض


والى هنا ينتهي الدرس
القادم افضل باذن الله
تابع القراءة

صندوق اشترك عبر البريد(mbt-sub-box) بألوان مختلفة


السلام عليكم ورحمة الله
معنا اضافة جذابة ومميزة عبارة صندوق اشتراك عبر البريد مقدمة من MBT
الاضافة في الاصل كانت باللون الاخضر
لذا قمت باضافة نموذجين اخرين باللون البرتقالي والازرق بعد تعريبها
يمكن ادراج الاضافة داخل اداة HTML ووضعها في اي مكان يناسبك سواء في السايد بار او فوق واسفل التدوينات 
ويستحسن ان تكون داخل التدوينة وهذا ماسنتطرق له اليوم

  • من لوحة التحكم نختار تحريرHTML
    ثم نقوم  ب
  • بعدها نبحث عن الوسم  <data:post.body/> باستخدام  CTRL+F


ثم نختار احد الأكواد التالية (حسب اللون الذي تريد) ونطبعه اسفله مباشرة










<style>
#mbt-sub-box{background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#1a2638));;border:1px
solid #1A2638;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #1a2638)}
#mbt-sub-box h1{margin-top:5px; color:#FFF;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 2px 3px #000;line-height:35px}
#mbt-sub-box input{background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 transparent;border:medium none;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #FFF;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}
#mbt-sub-box .submit{background: -webkit-gradient(linear, left top, left bottom, from(#DD501A), to(#FF9620));background: -moz-linear-gradient(center top , #DD501A, #FF9620) repeat scroll 0 0 transparent;color:#FFF;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}
#mbt-sub-box .submit:hover{background: -moz-linear-gradient(center top , #FF9620, #DD501A) repeat scroll 0 0 transparent}
#mbt-sub-box .submit:active{background: -moz-linear-gradient(center top , #FF9620, #DD501A) repeat scroll 0 0 transparent}
</style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='mbt-sub-box'><h1>إشترك لتحصل على جديد المواضيع </h1><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=blogspot/bijed&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><center> <input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;أدخل بريدك الإلكتروني هنا ...&quot;;}' onfocus='if (this.value == &quot;أدخل بريدك الإلكتروني هنا ...&quot;) {this.value = &quot;&quot;}' size='30' type='text' value='أدخل بريدك الإلكتروني هنا ...'/> <input name='uri' type='hidden' value='blogspot/bijed'/> <input name='loc' type='hidden' value='en_US'/> <input class='submit' type='submit' value='إشترك الأن'/></center></form></div>
</b:if>
















<style>
#mbt-sub-box{background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#1a2638));;border:1px
solid #1A2638;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #1a2638)}
#mbt-sub-box h1{margin-top:5px; color:#FFF;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 2px 3px #000;line-height:35px}
#mbt-sub-box input{background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 transparent;border:medium none;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #FFF;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}
#mbt-sub-box .submit{background: -webkit-gradient(linear, left top, left bottom, from(#369a18), to(#205f0d));background: -moz-linear-gradient(center top , #369A18, #205F0D) repeat scroll 0 0 transparent;color:#FFF;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}
#mbt-sub-box .submit:hover{background: -moz-linear-gradient(center top , #46B725, #205F0D) repeat scroll 0 0 transparent}
#mbt-sub-box .submit:active{background: -moz-linear-gradient(center top , #46B725, #205F0D) repeat scroll 0 0 transparent}
</style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='mbt-sub-box'><h1>إشترك لتحصل على جديد المواضيع </h1><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=blogspot/bijed&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><center> <input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;أدخل بريدك الإلكتروني هنا ...&quot;;}' onfocus='if (this.value == &quot;أدخل بريدك الإلكتروني هنا ...&quot;) {this.value = &quot;&quot;}' size='30' type='text' value='أدخل بريدك الإلكتروني هنا ...'/> <input name='uri' type='hidden' value='blogspot/bijed'/> <input name='loc' type='hidden' value='en_US'/> <input class='submit' type='submit' value='إشترك الأن'/></center></form></div>
</b:if>







<style>
#mbt-sub-box{background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#1a2638));;border:1px
solid #1A2638;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #1a2638)}
#mbt-sub-box h1{margin-top:5px; color:#FFF;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 2px 3px #000;line-height:35px}
#mbt-sub-box input{background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 transparent;border:medium none;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #FFF;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}
#mbt-sub-box .submit{background: -webkit-gradient(linear, left top, left bottom, from((#3515DA), to((#3B68F0));background: -moz-linear-gradient(center top , #3515DA, #3B68F0) repeat scroll 0 0 transparent;color:#FFF;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}
#mbt-sub-box .submit:hover{background: -moz-linear-gradient(center top , #3B68F0, #3515DA) repeat scroll 0 0 transparent}
#mbt-sub-box .submit:active{background: -moz-linear-gradient(center top , #3B68F0, #3515DA) repeat scroll 0 0 transparent}
</style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='mbt-sub-box'><h1>إشترك لتحصل على جديد المواضيع </h1><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=blogspot/bijed&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><center> <input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;أدخل بريدك الإلكتروني هنا ...&quot;;}' onfocus='if (this.value == &quot;أدخل بريدك الإلكتروني هنا ...&quot;) {this.value = &quot;&quot;}' size='30' type='text' value='أدخل بريدك الإلكتروني هنا ...'/> <input name='uri' type='hidden' value='blogspot/bijed'/> <input name='loc' type='hidden' value='en_US'/> <input class='submit' type='submit' value='إشترك الأن'/></center></form></div>
</b:if>





  • في النهاية أيا كان اللون الذي اخترته لاتنسى تغيير مالونه احمر الى رابط الخلاصة الخاص بمدونتك
 
 والقادم افضل باذن الله
 
تابع القراءة

الحواف المستديرة للصور بدون برامج !


السلام عليكم ورحمة الله
معنا اليوم اضافة جميلة لتدوير حواف الصور بتقنية  css من موقع : roundpic

وطريقة الاستخدام سهلة وبسيطة  فقط ارفع الصورة من جهازك أو ضع رابط الصورة المراد تدوير حوافها ثم اضغط على زر generate rounded image







Round Your Image Corners Now!




Image:
or URL:





This widget is a coutesy of roundpic.



كود الاضافة يمكن طبعه داخل أداة   html   أو داخل التدوينة بعد الانتقال الى وضع تحرير  html





<h3>Round Your Image Corners Now!</h3>  <p><em></em></p> <style>





input {
color:#289728;
font: normal 14px  arial, sans-serif, verdana;
border:1px dotted #67a7e3; 
background:#fff; padding:4px 2px;
}

input:hover {
border:1px solid #67a7e3;
} </style><form enctype="multipart/form-data" method="post" action="http://www.roundpic.com"><input name="MAX_FILE_SIZE" type="hidden">     <br>    <table><tbody>       <tr>         <td class="title"><b>Image:</b></td>          <td><input style="border-width: 1px; border-style: dotted; border-color: rgb(0, 128, 255); padding: 4px 2px; margin-right: 0px;" name="file" type="file"></td>       </tr>        <tr>         <td class="title">or <b>URL:</b></td>          <td class="input"><input name="url"></td>       </tr>        <tr>         <td class="submit" colspan="2"><button onclick="getLoader();" type="submit">Generate Rounded Image!</button></td>       </tr>     </tbody></table> </form>  <p><em></em></p>  <p><em></em></p>  <p><em></em></p>  <p><em>     </em></p><hr><em>This widget is a coutesy of </em><a href="http://roundpic.com" target="_blank"><em>roundpic</em></a>.



والى هنا ينتهي الموضوع دمتم بود و في أمان الله

تابع القراءة

الربح من النت:ج2 Commission Junction

السلام عليكم ورحمة الله
معنا اليوم شركة رائدة في عالم النشر والاعلان وهي شركة  Commission Junction
 وهي لا تختلف عن اعلانات ادسنس كثيرا
وتعتمد نفس المنهج الربحي المعتمد من الناشرين والمعلنين
غير انها توفر بعض العروض الخاصة وبعض الحلول للناشرين

يمكنك الاطلاع على دليل من هنا

وكما ذكرت الشركة ناجحة ولها تاريخ في عالم الاعلان والربح من النت لهذا يجب ان تتوفر بعض الشروط في الناشرين 
لمن يريد خوض تجربة الربح مع هذه الشركة ماعليه الا ان يبدأ من هنا  

الى هنا ينتهي الموضوع وللموضوع بقية ان شاء الله
تابع القراءة

رفع ملفات الجافا على بلوجر!!


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

معاينة الدرس

لكن موضوع اليوم عن كيفية رفع ملفات الجافا بانواعها بما في ذلك جافا كويري أو جي كويري على بلوجر نفسه! وذلك لتصفح اسرع ولان كثرة الاكواد المرفوعة على روابط مباشرة تجعل تصفح المدونة بطيئ جدا


طيب معنا مثال بسيط للتوضوح فرضا انو الملف المراد استضافته مرفوع على رابط مباشر كالتالي:
http://youcef-bijed.googlecode.com/files/slider.js


نقوم بتحميله ثم نفتحه باستخدام المفكرة ويكون محتواه كالتالي






$(document).ready(function () {
    $('img.menu_class').click(function () {
    $('ul.the_menu').slideToggle('medium');
    });
});


نقوم بنسخ الكود ثم نرفعه على مدونة بلوجر وذلك بادراجه داخل الكود التالي


  <script type='text/javascript'>


    //<![CDATA[

  ضع كود الجافا هنا

    //]]>

    </script>


 


ليصبح الشكل النهائي للكود كالتالي

  <script type='text/javascript'>

    //<![CDATA[

    $(document).ready(function () {
    $('img.menu_class').click(function () {
    $('ul.the_menu').slideToggle('medium');
    });
});

    //]]>

    </script>





وطبعا مكان الكود الناتج يكون مابين الوسمين  <head>   و  <head/>




<head>   

 هنا كود الجافا


<head/>



والى هنا ينتهي الموضوع نلتقي في مواضيع اخرى قادمة ان شاء الله

 
تابع القراءة