رئيسية المعهد
رئيسية المعهد  تواصل معنا  حقوق الملكية الفكرية  اربط مدونتك بنا  محول أكواد أدسنس

 

معرض قوالب معهد خبراء بلوجر - دليل مدونات بلوجر - موقع نشر بلوجر - اضافات بلوجر




العودة   معهد خبراء بلوجر > الدعم الفني > إضافات وأدوات بلوجر
تحديث الصفحة اضافة زر الذهاب إلى الأعلى و الأسفل مثل مدونة حياتكـُم
التسجيل التعليمـــات التقويم مشاركات اليوم البحث


 
نسخ الرابط
نسخ للمنتديات
 
أدوات الموضوع انواع عرض الموضوع
السابق المشاركة السابقة   المشاركة التالية التالي
قديم 08-20-2013, 07:28 PM   #1
مدونة حياتكـُم
مدون جديد
 
الصورة الرمزية مدونة حياتكـُم
 
تاريخ التسجيل: Aug 2013
المشاركات: 71
Thumbs up اضافة زر الذهاب إلى الأعلى و الأسفل مثل مدونة حياتكـُم
أنا : مدونة حياتكـُم
سجل معنا لتتمتع بهذه الخاصية




أزرار صعود وهبوط يمكنك استخدامها للتنقل إلى أعلى وأسفل محتوى الصفحة، وخصوصا عندما يكون هناك العديد من المواد في الصفحة الرئيسية أو عندما يكون هناك مقال لديه الكثير من التعليقات. هذه الأزرار لها تأثير FADEIN الاختفاء التدريجي، وهذا يعني أنها سوف تتلاشى قليلا عندما يكون التمرير إلى أعلى أو أسفل الصفحة .

لمعـاينـة الإضافة : إضغط هنـا

كيفية تركيب الاضافة . تابع الخطوات :)

الخطوة 1. الذهاب إلى قالب، انقر على زر تحرير HTML

الخطوة 2. حدد "توسيع قوالب القطعة" مربع

الخطوة 3. بحث (باستخدام CTRL + F) عن الكود الاتي :
اقتباس:
]]></b:skin>
الخطوة 4. فقط فوق هذا الرمز، الصق هذا الكود :
اقتباس:
/* Up and Down Buttons with jQuery
----------------------------------------------- */
.button_up{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: whiteurl() no-repeat top left;
background-position:50% 50%;
width:20px; /* Button's width */
height:20px; /* Button's height */
bottom:280px; /* Distance from the bottom */
right:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opa city=70);
}
.button_down{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: white url() no-repeat top left;
background-position:50% 50%;
width:20px; /* Button's width */
height:20px; /* Button's height */
bottom:242px; /* Distance from the bottom */
right:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opa city=70);
}
الخطوة 5. الآن بحث (CTRL + F) عن هذه العلامة:
اقتباس:
</body>
الخطوة 6. وفوق ذلك، الصق الكود التالي :
اقتباس:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

<div class='button_up' id='button_up' style='display:none;'/>
<div class='button_down' id='button_down' style='display:none;'/>

<script>
//<![CDATA[
(function(){var special=jQuery.event.special,uid1='D'+(+new Date()),uid2='D'+(+new Date()+1);special.scrollstart={setup:function(){va r timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout( timer)}else{evt.type='scrollstart';jQuery.event.ha ndle.apply(_self,_args)}timer=setTimeout(function( ){timer=null},special.scrollstop.latency)};jQuery( this).bind('scroll',handler).data(uid1,handler)},t eardown:function(){jQuery(this).unbind('scroll',jQ uery(this).data(uid1))}};special.scrollstop={laten cy:300,setup:function(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout( timer)}timer=setTimeout(function(){timer=null;evt. type='scrollstop';jQuery.event.handle.apply(_self, _args)},special.scrollstop.latency)};jQuery(this). bind('scroll',handler).data(uid2,handler)},teardow n:function(){jQuery(this).unbind('scroll',jQuery(t his).data(uid2))}}})();

$(function() {
var $elem = $('body');
$('#button_up').fadeIn('slow');
$('#button_down').fadeIn('slow');
$(window).bind('scrollstart', function(){
$('#button_up,#button_down').stop().animate({'opac ity':'0.2'});
});
$(window).bind('scrollstop', function(){
$('#button_up,#button_down').stop().animate({'opac ity':'1'});
});
$('#button_down').click(
function (e) {
$('html, body').animate({scrollTop: $elem.height()}, 800);
} );
$('#button_up').click(
function (e) {
$('html, body').animate({scrollTop: '0px'}, 800);
} );});
//]]>
</script>
الخطوة 7. وأخيرا، حفظ القالب.
اي استفسار او اي مشكلة تواجهك الرجاء ترك تعليق اسفل الموضوع .
وشكرا

الدعم العربي

مدونة حياتكـُم غير متواجد حالياً   رد مع اقتباس

مركز رفع موسوعة العربية
 

مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)
مدونة حياتكـُم, hayatokom.blogspot.com

« الموضوع السابق | الموضوع التالي »

الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)
 

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك
BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة
الانتقال السريع

المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
مدونة حياتكـُم .. تهتم بكل ما يبحث عنه الشاب العربي مدونة حياتكـُم المنتدى الإشهاري 3 08-29-2013 06:31 PM
طريقة اضافة تعليقات google plus إلى مدونة بلوجر theprince19 إضافات وأدوات بلوجر 3 08-29-2013 05:33 PM
اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر بلال حمدان إضافات وأدوات بلوجر 7 05-13-2013 09:59 AM



سياسة الخصوصية - Privacy-Policy - اربط مدونتك بنا - حقوق الملكية والتأليف - الاتصال بنا - معهد خبراء بلوجر - الأرشيف - الأعلى


لتصفح أفضل وللاستفادة القصوى من خصائص المعهد ننصحكم باستعمال :

Powered by vBulletin® Copyright ©2000 - 2025 Dov By EGYNT.Co
new notification by 9adq_ala7sas
Developed By Marco Mamdouh
معهد خبراء بلوجر - 2012 Google
أعلن على المعهد : اتصل بنا - منتدي كنوز - الدعم العربي - قوالب بلوجر - او او انيمي
رئيسية المعهد
الساعة الآن 05:18 AM - بتوقيت جرينتش
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسؤولية نفسه تجاه ما يقوم به من بيع وشراء وإتفاق وإعطاء معلومات مدونته
التعليقات المنشورة لا تعبر عن رأي معهد خبراء البلوجر ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر)