اضافة شريط تحميل للمدونة مثل يوتيوب حصريا مدونة علي نائل

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

1-نضيف الكود التالي فوق الـ ]]</b:skin>

 /* Youtube Loading */
<Style>
#progress {
position: fixed;
z-index: 2147483647;
top: 0;
left: -6px;
width: 1%;
height: 2px;
background: #0088CC;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
-moz-transition: width 500ms ease-out,opacity 400ms linear;
-ms-transition: width 500ms ease-out,opacity 400ms linear;
-o-transition: width 500ms ease-out,opacity 400ms linear;
-webkit-transition: width 500ms ease-out,opacity 400ms linear;
transition: width 500ms ease-out,opacity 400ms linear;
}
#progress dd, #progress dt {
position: absolute;
top: 0;
height: 2px;
-moz-box-shadow: #0088CC 1px 0 6px 1px;
-ms-box-shadow: #0088CC 1px 0 6px 1px;
-webkit-box-shadow: #0088CC 1px 0 6px 1px;
box-shadow: #0088CC 1px 0 6px 1px;
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
border-radius: 100%;
}
#progress dt {
opacity: .6;
width: 180px;
right: -80px;
clip: rect(-6px,90px,14px,-6px);
}
#progress dd {
opacity: .6;
width: 20px;
right: 0;
clip: rect(-6px,22px,14px,10px);
}
</style> 

2- نبحث عن </body> ونضيف الكود التالي فوقه مباشرتا

 .<script type='text/javascript'>
 jQuery(document).ready(function() {
jQuery("body").append(jQuery("
").attr("id", "progress"));

jQuery("#progress").width(100+ "%");

jQuery("#progress").width("101%").delay(800).fadeOut(400, function() {

jQuery(this).remove();

});

});

</script> 

الى هنا انتهى الموضوع اتمنى ان تعجبكم هذه الاضافة في الاخير غير مسامح من يقوم بنقل الموضوع دون ذكر المصدر , وشكرا اي استفسار اترك تعليق وننتظر تشجعاتكم لتقديم كل جديد لكم