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

السلام عليكم ورحمة الله وبركاته
درس جديد عن كيفية اضافة شريط تحميل للمدونة في الاعلى لاضافة لمسه جميله وراقيه على شكل االمواقع والمدونات
لتركيب الاضافه تابع معى الشرح :
ادخل الى بلوجر
قالب ثم تحرير html
ابحث عن الكود التالى </b:skin>]]
اضف الكود التالى قبله مباشره

كود HTML:

/* 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>

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

كود HTML:

.<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>

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