عرض مشاركة واحدة
قديم 08-09-2014, 07:23 PM   #1
zakone
مدون جديد
 
تاريخ التسجيل: Aug 2013
المشاركات: 48
Wink طريقة جعل الهيدر منسق بخاصية Sticky


مرحبا بكم في درس جديد من مدونة أبطر .
درس اليوم هو درس جد مطلوب عند العرب وهو طريقة جعل الهيدر منسق بمعنى جعل الهيدر تابع للمدونة اثناء تصفحها .
معاينة الإضافة
بعد معاينة الإضافة نذهب إلى طريقة إضافة هذه الخاصية :
  • اذهب الى لوحة تحكم بلوجر من*هنا.
  • إذهب إلى تبويبة القالب .
  • إعمل نسخة إحتياطية لتفادي المشاكل.
  • إبحث عن الكود*التالي بإستعمال {Ctrl+F}
كود بلغة HTML:
</body>
  • واضف مباشرة اعلاه/فوقه الكود التالي :
كود بلغة HTML:
<script>
/<![CDATA[
Abter_makeSticky("IDNav");
/http://www.abter.blogspot.com/
function Abter_makeSticky(elem) {
var Abter_sticky = document.getElementById(elem);
var scrollee = document.createElement("div");
Abter_sticky.parentNode.insertBefore(scrollee, Abter_sticky);
var width = Abter_sticky.offsetWidth;
var iniClass = Abter_sticky.className + ' Abter_sticky';
window.addEventListener('scroll', Abter_sticking, false);
function Abter_sticking() {
var rect = scrollee.getBoundingClientRect();
if (rect.top < 0) {
Abter_sticky.className = iniClass + ' Abter_sticking';
Abter_sticky.style.width = width + "px";
} else {
Abter_sticky.className = iniClass;
}}}
/http://www.abter.blogspot.com/
/]]>
</script>
<style>
.Abter_sticking {background:#202020 !important;position:fixed !important;
top:0; z-index:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3);
*margin-top: 0; position:relative\9 !important;}
</style>
[*]غير*#202020*باللون الخاص بهايدر او قائمة مدونتك.[*]غير IDNav بال id الخاص بالهايدر لمدونتك و يمكنك تحديده عبر الشكل التالي :
  • إذهب إلى مدونتك .
  • إضغط F12 .
  • بعد ذلك إبحث عن كلمة موجودة في الهيدر الخاص بك بإستعمال {Ctrl+F} كما في الصورة (انا بحث عن قائمة أبطر ) :
  • بعد ذلك ستصعد في الاسطر تدريجيا بسهم الفارة حتى يحدد الهايدر كاملا كما في الصورة التالية :
  • بعدها ستجد*"id="nav*او اي شئ امام*=id قم بوضعه مكان*IDNav*في الكود السابق .
إنتهى :)
المصدر : مدونة أبطر

الدعم العربي


التعديل الأخير تم بواسطة zakone ; 08-09-2014 الساعة 07:25 PM
zakone غير متواجد حالياً   رد مع اقتباس