بسم الله الرحمن الرحيم
السلام عليكم ورحمه الله وبركاته ، زوار ومتابعي بلوجر فيس العرب عدنا لكم اليوم بإضافه زر الصعود للمدونات ندخل الي صلب الموضوع .
بعد تسجيل دخولك إلى مدونتك توجه إلى صفحة التصميم ثم تحرير HTML.
الآن ابحث عن <head> و بعده مباشرة ضع الأكواد الآتية :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
|
بعد ذالك ابحث عن ]]></b:skin> و مباشرة فوقها ضع الأكواد الآتية:
#scroll-top {
background-color: #777777;
border-radius: 24px;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.8) inset;
color: #FFFFFF;
cursor: pointer;
display: block;
font-family: Verdana;
font-size: 2em;
font-weight: bold;
line-height: 2em;
text-align: center;
text-decoration: none;
position:fixed;
width: 48px;
height: 48px;
bottom:30px;
right:20px;
opacity:0.85;
transition:opacity 0.25s ease 0s;
}
#scroll-top:hover{
opacity: 1;
color: #FFFFFF;
}
|
ثم ابحث عن </body> وفوقه مباشرهً ضع الكود التالي
<script type='text/javascript'>
$(function() {
$.fn.scrolltoTop = function() {
var scrollLink = $(this),
win = $(window);
scrollLink.hide();
if (win.scrollTop() != '0'){
scrollLink.fadeIn('slow')
}
win.scroll(function() {
if (win.scrollTop() == '0'){
scrollLink.fadeOut('slow')
}
else{
scrollLink.fadeIn('slow')
}
});
scrollLink.click(function() {
$('html, body').animate({
scrollTop: 0
}, 'slow')
})
}
});
$(function() {
$('#scroll-top').scrolltoTop();
});
</script>
<a id='scroll-top' href='#' title='الي الاعلى'>^</a>
|
ثم أخيرا اضغط زر حفظ القالب.
هذه معاينه للزر
دمتم سالمين ،،،
ارجو منكم الدخول وتقييم مدونت لاني جديد
من هنـــــــأ
http://face-alarab.blogspot.com