شرح التركيب
- أولا سوف تقوم بوضع الكود التالى فى مدونتك فوق الوسم التالى</body>
<script> $(function(){$(".element").typed({ strings: ["مرحبا بكم متابعى مدونة عالم المدون", "أتمنى أن تجد ما تبحث عنه على المدونة", "عالم المدون يوفر لك كل ما يخص بلوجر", "من قوالب وإضافات وشروحات وكل شئ", "بالتوفيق للجميع فى ما يبحثو عنة"],typeSpeed:50,loop: true,});}); /*<![CDATA[*/ ! function(b){var a = function(d,c){this.el = b(d);this.options = b.extend({} ,b.fn.typed.defaults,c);this.isInput = this.el.is("input");this.attr = this.options.attr;this.showCursor = this.isInput ? false:this.options.showCursor;this.elContent = this.attr ? this.el.attr(this.attr):this.el.text();this.contentType = this.options.contentType;this.typeSpeed = this.options.typeSpeed;this.startDelay = this.options.startDelay;this.backSpeed = this.options.backSpeed;this.backDelay = this.options.backDelay;this.strings = this.options.strings;this.strPos = 0;this.arrayPos = 0;this.stopNum = 0;this.loop = this.options.loop;this.loopCount = this.options.loopCount;this.curLoop = 0;this.stop = false;this.cursorChar = this.options.cursorChar;this.shuffle = this.options.shuffle;this.sequence = [];this.build()} ;a.prototype ={constructor:a,init:function(){var c = this;c.timeout = setTimeout(function(){for (var d = 0;d < c.strings.length;++d){c.sequence[d] = d} if (c.shuffle){c.sequence = c.shuffleArray(c.sequence)} c.typewrite(c.strings[c.sequence[c.arrayPos]],c.strPos)} ,c.startDelay)} ,build:function(){if (this.showCursor === true){this.cursor = b('<span class="typed-cursor">' + this.cursorChar + "</span>");this.el.after(this.cursor)} this.init()} ,typewrite:function(d,e){if (this.stop === true){return} var f = Math.round(Math.random() * (100 - 30)) + this.typeSpeed;var c = this;c.timeout = setTimeout(function(){var i = 0;var l = d.substr(e);if (l.charAt(0) === "^"){var k = 1;if (/^\^\d+/.test(l)){l = /\d+/.exec(l)[0];k += l.length;i = parseInt(l)} d = d.substring(0,e) + d.substring(e + k)} if (c.contentType === "html"){var h = d.substr(e).charAt(0);if (h === "<" || h === "&"){var g = "";var j = "";if (h === "<"){j = ">"} else{j = ";"} while (d.substr(e).charAt(0) !== j){g += d.substr(e).charAt(0);e++} e++;g += j}} c.timeout = setTimeout(function(){if (e === d.length){c.options.onStringTyped(c.arrayPos);if (c.arrayPos === c.strings.length - 1){c.options.callback();c.curLoop++;if (c.loop === false || c.curLoop === c.loopCount){return}} c.timeout = setTimeout(function(){c.backspace(d,e)} ,c.backDelay)} else{if (e === 0){c.options.preStringTyped(c.arrayPos)} var m = d.substr(0,e + 1);if (c.attr){c.el.attr(c.attr,m)} else{if (c.isInput){c.el.val(m)} else{if (c.contentType === "html"){c.el.html(m)} else{c.el.text(m)}}} e++;c.typewrite(d,e)}} ,i)} ,f)} ,backspace:function(d,e){if (this.stop === true){return} var f = Math.round(Math.random() * (100 - 30)) + this.backSpeed;var c = this;c.timeout = setTimeout(function(){if (c.contentType === "html"){if (d.substr(e).charAt(0) === ">"){var g = "";while (d.substr(e).charAt(0) !== "<"){g -= d.substr(e).charAt(0);e--} e--;g += "<"}} var h = d.substr(0,e);if (c.attr){c.el.attr(c.attr,h)} else{if (c.isInput){c.el.val(h)} else{if (c.contentType === "html"){c.el.html(h)} else{c.el.text(h)}}} if (e > c.stopNum){e--;c.backspace(d,e)} else{if (e <= c.stopNum){c.arrayPos++;if (c.arrayPos === c.strings.length){c.arrayPos = 0;if (c.shuffle){c.sequence = c.shuffleArray(c.sequence)} c.init()} else{c.typewrite(c.strings[c.sequence[c.arrayPos]],e)}}}} ,f)} ,shuffleArray:function(f){var c,e,d = f.length;if (d){while (--d){e = Math.floor(Math.random() * (d + 1));c = f[e];f[e] = f[d];f[d] = c}} return f} ,reset:function(){var c = this;clearInterval(c.timeout);var d = this.el.attr("id");this.el.after('<span id="' + d + '"/>');this.el.remove();if (typeof this.cursor !== "undefined"){this.cursor.remove()} c.options.resetCallback()}} ;b.fn.typed = function(c){return this.each(function(){var f = b(this),e = f.data("typed"),d = typeof c == "object" && c;if (!e){f.data("typed",(e = new a(this,d)))} if (typeof c == "string"){e[c]()}} )} ;b.fn.typed.defaults ={strings:["These are the default values...","You know what you should do?","Use your own!","Have a great day!"],typeSpeed:0,startDelay:0,backSpeed:0,shuffle:false,backDelay:500,loop:false,loopCount:false,showCursor:true,cursorChar:"|",attr:null,contentType:"html",callback:function(){} ,preStringTyped:function(){} ,onStringTyped:function(){} ,resetCallback:function(){}}} (window.jQuery); /*]]>*/ </script>
- سوف تقوم بتعديل ما فى الكتابة بما تريدها فى هذا الكود
- الأن الكود الثانى وسوف تضعه فوق الوسم التالى]]></b:skin>فى مدونتك
#about{background-color:#fff;padding-top:50px;padding-bottom:50px;background-image:url(https://2.bp.blogspot.com/-w57VuTGUWJ8/WNHPscEAxGI/AAAAAAAACs8/rIu5g-6PY1A4xUlWMUvZitFYgbm72pnwgCLcB/s1600/wdbloog.png)!important;background-position:center center!important;background-repeat:no-repeat!important;background-size:cover!important;transition:opacity .5s ease 0;overflow:hidden;margin-bottom: 15px;} .vc_column-inner{padding-top:35px;text-align:center} #countdown-timer{font-weight:700;margin:0 -30px;display:inline-block} #countdown-timer >.countdown-section{display:block;float:left;font-size:62px;line-height:1;color:#fff;margin:0 30px} .countdown-section i{background-color: #FFFFFF;font-size:40px;color:#5A67A6;border-radius:50%;width:80px;height:80px;line-height:80px;margin-bottom:10px;padding-left:3px} #countdown-timer >.countdown-section >.countdown-period{display:block;font-size:22px;margin-top:8px;line-height:1;text-transform:uppercase;letter-spacing:1px;color:#fff;font-weight:500} .type-wrap{color:#FFF;font-size:63px;line-height:124px;font-weight:900;min-height:119px} .element{direction:rtl;display:inline-block} .typed-cursor{opacity:1;color:#7B88CC;font-weight:100;-webkit-animation:blink 0.7s infinite;-moz-animation:blink 0.7s infinite;-ms-animation:blink 0.7s infinite;-o-animation:blink 0.7s infinite;animation:blink 0.7s infinite} .item #about,.error_page #about,.static_page #about{display:none}
- الأن مع اخر كود وسوف تضعه فى المكان الذى تريده
<h2 class='type-wrap'> <div class='element'/> </h2>
- وبعد ذلك تفوم بحفظ القالب ومبروك عليك الأضافة
وهكذا كان موضوع اليوم بالتوفيق للجميع فى أمان الله
المصدر عالم المدون
إرسال تعليق
جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).