منتديات قلب مسلم
قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  613623
عزيزي الزائر / عزيزتي الزائرة يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي
سنتشرف بتسجيلك
شكرا قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  829894
ادارة المنتدي قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  103798
منتديات قلب مسلم
قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  613623
عزيزي الزائر / عزيزتي الزائرة يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي
سنتشرف بتسجيلك
شكرا قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  829894
ادارة المنتدي قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  103798
منتديات قلب مسلم
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.



 
الرئيسيةالبوابه جديد*أحدث الصورالتسجيلدخول

 

 قائمة أفقية ثابتة لمدونات بلوجر بشكل احترافي

اذهب الى الأسفل 
كاتب الموضوعرسالة
عمده المصريين
نائب الاداره
نائب الاداره
عمده المصريين


عدد الرسائل : 425
العمر : 53
اعلام الدول : قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Female78
  : قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  15781610
مزاجك اليوم : روش
الهويه : قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Huntin10
مدي احترامك لقوانين المنتدي : قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  21010
المهنه : قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Engine10
السٌّمعَة : 1
تاريخ التسجيل : 18/10/2008

قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Empty
مُساهمةموضوع: قائمة أفقية ثابتة لمدونات بلوجر بشكل احترافي    قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Emptyالأربعاء ديسمبر 04, 2013 4:09 pm

اليوم أقدم لكم اضافة جميلة ويحتاجها الكثيرة منا ونرى انها مستعملة  في أشهر المواقع الإجتماعية ، إنها قائمة افقية ثابتة اي تتبعك وانت تتصفح المدونة اذا نزلت تنزل معك واذا صَعِدْتَ صَعَدَتْ معك، أقدم لكم صورة الأداة بعد ان قمت بتعريبها و تطويرها:
قائمة أفقية ثابتة لمدونات بلوجر  بشكل احترافي  Menu-ayoubetmaiti


- كما نلاحظ ان القائمة تحتوي على سهم يقوم بإصعادنا الى الاعلى واخر اتجاهه الى الأسفل يقوم بإنزالنا وبعدها نرى 5 ازرار يمككنا وضع روابطنا فيها ويمكننا زيادة العدد او العكس، ايضا نرى مربع بحث في الاضافة الأصل الغير المعربة مربع البحث لا يعمل وانا جعلته يعمل وبشكل جيد كما ينبغي,عندما ننزل القائمة تصبح شفافة نوعا ما وعندما نضع المؤشر عليها تصبح عادية كما كانت في السابق


الأن حان وقت عرض الاكواد لوضع هذه القائمة الرائعة في مدونتنا:

الخطوات: 

أولا سنقوم بأخذ بعض الإحطياتات، سنقوم بحفظ القالب من اجل تفادي حصول اي مشكلة ، ثم نتجه الى تحرير html ، ثم نضغط على متابعة.نقوم بالضغط على Cntrl + F اذا كنت تستخدم متصفح جديد مثل كرومي او موزيلا ونبحث عن :  </head>

ونقوم بإلصاق هذا الكود قبله .
اقتباس :
<script src='http://helplogger.googlecode.com/svn/trunk/html/[helplogger.blogspot.com]jquery-1.3.2.js' type='text/javascript'/>
 <script type='text/javascript'>
            $(function() {
                $(window).scroll(function(){
                    var scrollTop = $(window).scrollTop();
                    if(scrollTop != 0)
                        $('#nav').stop().animate({'opacity':'0.2'},400);
                    else   
                        $('#nav').stop().animate({'opacity':'1'},400);
                });
               
                $('#nav').hover(
                    function (e) {
                        var scrollTop = $(window).scrollTop();
                        if(scrollTop != 0){
                            $('#nav').stop().animate({'opacity':'1'},400);
                        }
                    },
                    function (e) {
                        var scrollTop = $(window).scrollTop();
                        if(scrollTop != 0){
                            $('#nav').stop().animate({'opacity':'0.2'},400);
                        }
                    }
                );
            });
        </script>
وبعد هذا سنقوم بالبحث على </body> بنفس الطريقة التي استخدمناها سابقا ونقوم بإلصاق الكود التالي قبله أيضا مع تعديل ما يناسب:


اقتباس :
<div id='nav'>
<ul>
<li><a class='top' href='#'><span/></a></li>
<li><a class='bottom' href='#bottom'><span/></a></li>
<li><a href='الرابط-1'><span>عنوان الرابط 1</span></a></li>
<li><a href='الرابط-2'><span>عنوان الرابط 2</span></a></li>
<li><a href='الرابط-3'><span>عنوان الرابط 3</span></a></li>
<li><a href='الرابط-4'><span>عنوان الرابط 4</span></a></li>
<li><a href='الرابط-5'><span>عنوان الرابط 5</span></a></li>
<li class='search1'>
<form action='/search' id='search1' method='get'>
        <input id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;ابحث في المدونة...&quot;;}' onfocus='if (this.value == &quot;ابحث في المدونة...&quot;) {this.value = &quot;&quot;}' type='text' value='ابحث في المدونة...'/>
        <input id='searchbutton' src='http://3.bp.blogspot.com/-80DxERf30RE/UBWOpjpQFII/AAAAAAAABB8/xOILGMsPazI/s1600/search-ico-ayoub-etmaiti.png' type='image'/>
    </form>
   
</li>
</ul>
</div> 
<div id='top'/>
<div class='desc'/>
<div id='bottom'/>
<div class='scroll'/>
نقوم بتغير الكلمات :
الرابط-1 ، 2 ، 3 ، 4  و  5   بروابطنا التي نريد ان يتم التوجيه اليها بعد الظغط على الزر ، ونغير العناوين : عنوان الرابط 1
، 2 ، 3 ، 4 و 5  بالكلمة التي ستظهر على زر

 مثال:
اقتباس :
<li><a href='ayoub-etmaiti.blogspot.com'><span>أيوب التمايتي</span></a></li>
وهذا هو كل شئ مع تحياتي اخوكم : عمده
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://akoad.gid3an.com/
 
قائمة أفقية ثابتة لمدونات بلوجر بشكل احترافي
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات قلب مسلم :: المنتدي الخدمي :: منتدي تعلم المواقع والمنتديات :: مدونه بلوجر-
انتقل الى: