كود في قمة الروعة للكتابة بالريشة على مدونتك

أسعد الله أوقاتكم بكل خير ومحبة

اهلا ومرحبا بكم في مدونة الخبراء للبرامج في إضافة جميلة وفريدة من نوعها
كود رائع للكتابة بالريشة يظهر وكأنك تكتب بشكل رائع. يعمل مع جافا سكربت وcss
يمكن إضافتها داخل مواضيع بلوجر ويمكن إستخدامه في الموضوع مثل كأنك تكتب أي مقال على مدونتك
ألم تلاحظ كيف كتبت هذا الموضوع؟ حاول إعادة تحميل الصفحة وسوف ترى بالفعل أن هذا الكود سحري
يمكن أن يعمل أيضاً في أي موقع أو صفحة تدعم جافا سكربت وcss
لقد أعجبني كثيراً فأحببت أن أشاركه معكم أكتب الأن مقال على مدونتك بإستخدام هذا الكود

الكود :

 <script type="text/javascript">
//<![CDATA[
window.onload = function(){
var vLetter = document.getElementById('escritura');
var iSpeedInk = 5;
var sText = document.getElementById('escritura_src').innerHTML;
var iCurChar = 0;
var sChars = '<span>';
var iCurInk = 0;
var sCurCaret = '';
var sCaret = " <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOJK7PkFL9ii7676d5sXGTMV_QIUxrhJTye_0mnD6SZ_YEmhbgv_KLpuoU_1dqvqRT8bA2zrenXPy792PJASxnzPA3t4G5iLZ9MKs6Yt3jaW-yw-f_78WqAddWIYIutsU2Jm5ejEVbxQE/w116-h143-no/pluma.gif' style='position:absolute' />";
var doStep = function () {
var sChar = sText.charAt(iCurChar);
var iDelay = 32;
if (sChar == '') {
sCurCaret = '';
} else if (sChar == '|') {
sChars = sChars.substring(0, sChars.length-1);
iDelay = 64;
} else if (sChar == '<') {
var iPos = sText.indexOf('>', iCurChar);
sChar = sText.substring(iCurChar, iPos + 1);
iCurChar = iPos;
} else if (sChar == '&') {
var iPos = sText.indexOf(';', iCurChar);
sChar = sText.substring(iCurChar, iPos + 1);
iCurChar = iPos;
} else if (sChar == '.') {
iDelay = 300;
} else if (sChar == ',') {
iDelay = 100;
} else if (sChar == ' ') {
iDelay = 32;
} else if (iCurChar > 5) {
sCurCaret = sCaret;
}
// expenditure of ink
if (sChar == ' ') {
iCurInk += iSpeedInk;
sChar = '</span><span style="color:RGB(' + (iCurInk) + ',' + (iCurInk) + ',' + (iCurInk) + ')">' + sChar;
}
if (document.getElementById('tintero').style.visibility == 'visible') {
sCurCaret = sCaret;
document.getElementById('tintero').style.visibility = 'hidden';
sChar = '</span><span style="color:RGB(0,0,0)">' + sChar;
}
if (iCurInk > 160) {
iCurInk = 0;
document.getElementById('tintero').style.visibility = 'visible';
iDelay = 1000;
sCurCaret = '';
}
sChars += sChar;
if (iCurChar == sText.length - 1)
sCurCaret = '';
vLetter.innerHTML = sChars + sCurCaret;
iCurChar++;
if (iCurChar < sText.length) {
setTimeout(doStep, 20 + iDelay);
}
}
doStep();
};
//]]>
</script>
<style>
#tintero {
bottom: 100px;
left: 140px;
position: relative;
visibility: hidden;
}
#escritura{
font-family: Comic Sans MS;
font-size: 18px;
font-weight: bold;
margin: 50px auto;
position: relative;
width: 75%;
}
#escritura_src {
display: none;
}
</style>

 أضف النص في الكود التالي :

 <div id="escritura_src">
ضع النص هنا
</div>
<div id="escritura"></div>
<img alt="tintero" id="tintero" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUlpM4QYUa_wTqJdHqpfzquDM7pmHUyJefUuXOjV22us0HhQNmcs4AK_hDJK_ZbB_srGniIy224N1Vx8F3c4hI12tRsTTgZC0wLX-vsv4X7Sd1BDX5OaTpMX9nkwiROGkDZz_rM_Wv1rk/s184/tintero2.gif" />