إضافة زر متغير الألوان

إضافة زر متغير الألوان زر بسيط يمكن أن يغير اللون في حد ذاته فقط، زر فريد من نوعه لأنه ليس بشكل عام، وعادة الأزرار لا تحتوي على أكواد الجافا، ولكن بخلاف هذا الزر فهو يتضمنه ويمكن إستعمال الأكواد في موضوع على حده لمن لا يريد أن يضيف الأكواد بداخل القالب، لذا فكود الجيكويري هو لتلوين اللون بتدرج.

شرح طريقة التركيب

1 . توجه لقالب >> تحرير

2. ابحث بإستعمال CTRL+F عن ]]></b:skin> أو ضعه بين <style> </style>

3. ضع الكود التالي قبله
.buttonz{display:inline-flex;border-radius:4px;cursor:pointer;font-size:13px;font-weight:bold;text-transform:uppercase;color:#FFF!important; background:url(//ar1web-com.googlecode.com/svn/trunk/rainbow.png);background-size:cover;padding:8px 25px;text-shadow:none;transition:all 1s;} .buttonz:hover, .buttonz:hover, .buttonz.link:hover {box-shadow: 0px 0px 18px 18px rgba(80, 80, 80, 0);}

4. ضع الكود التالي إما فوق </head> أو فوق </body>

 <script type='text/javascript'>
var intval = null;
var pos = 0;
$(document).ready(function() {
intval = window.setInterval(moveBg, 70);
});
function moveBg() {
pos++; 
$('.buttonz').css({backgroundPosition: (pos * 1) + '% 1px'});
}
  </script>

5. لتفعيل الزر ضع الكود التالي بداخل الموضوع بتبويب HTML

 <a class='buttonz' href='هنا الرابط' target='_blank'>إسم الزر</a>

عن Unknown

هذا النص هو مثال لنص يمكن ان يستبدل في نفس المساحة ايضا يمكنك زيارة مدونة مدون محترف لمزيد من تحميل قوالب بلوجر.

إضافة زر متغير الألوان

عن Unknown

مواضيع ذات صلة