|
|
|
|
أدوات الموضوع | انواع عرض الموضوع |
04-29-2013, 06:08 PM | #1 |
عضو شرف
تاريخ التسجيل: Aug 2012
المشاركات: 231
|
اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
أزراv صعو] وهبوط يمكن استخدامها للتنقل إلى أعلى وأسفل محتوى الصفحة، وخصوصا عندما يكون وهناك العديد من المواد على الصفحة الرئيسية أو عندما يكون هناك مقال لديه الكثير من التعليقات. هذه الأزرار لها تأثير FADEIN الاختفاء التدريجي، وهذا يعني أنها سوف تتلاشى قليلا عندما نكون التمرير إلى أعلى أو أسفل الصفحة
كيفية تركيب الاضافة . تابع الخطوات :) الخطوة 1. الذهاب إلى قالب، انقر على زر تحرير HTML الخطوة 2. حدد "توسيع قوالب القطعة" مربع الخطوة 3. بحث (باستخدام CTRL + F) عن الكود الاتي : كود بلغة HTML:
]]></b:skin>
كود بلغة HTML:
/* 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(http://4.bp.blogspot.com/-7zE5N9GdDUk/T6rH17KE6II/AAAAAAAACeQ/aEcKRyEhxsE/s16/arrow_up.png) 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(opacity=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(http://3.bp.blogspot.com/-sukwuViZaYY/T6rH15A8niI/AAAAAAAACeM/YErd0S8lPGA/s16/arrow_down.png) 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(opacity=70); } كود بلغة HTML:
</body>
كود بلغة HTML:
<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(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout(timer)}else{evt.type='scrollstart';jQuery.event.handle.apply(_self,_args)}timer=setTimeout(function(){timer=null},special.scrollstop.latency)};jQuery(this).bind('scroll',handler).data(uid1,handler)},teardown:function(){jQuery(this).unbind('scroll',jQuery(this).data(uid1))}};special.scrollstop={latency: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)},teardown:function(){jQuery(this).unbind('scroll',jQuery(this).data(uid2))}}})(); $(function() { var $elem = $('body'); $('#button_up').fadeIn('slow'); $('#button_down').fadeIn('slow'); $(window).bind('scrollstart', function(){ $('#button_up,#button_down').stop().animate({'opacity':'0.2'}); }); $(window).bind('scrollstop', function(){ $('#button_up,#button_down').stop().animate({'opacity':'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> المصدر : http://www.computer-com.com/2013/04/blog-post_29.html
__________________
مدونة كمبيوتر كوم | دروس بلوجر , اضافات بلوجر و قوالب بلوجر com-pc.blogspot.com |
05-01-2013, 07:09 PM | #2 |
مدون جديد
تاريخ التسجيل: Apr 2013
المشاركات: 16
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
|
05-01-2013, 09:20 PM | #3 |
مدون جديد
تاريخ التسجيل: May 2013
المشاركات: 25
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
|
05-02-2013, 10:43 PM | #4 |
مدون جديد
تاريخ التسجيل: Apr 2013
المشاركات: 72
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
موقع كينج نت الدعم الفنى لمدونات بلوجر http://www.kingnt.com (( لا خير فى كاتم العلم )) |
05-04-2013, 12:25 PM | #5 |
مدون جديد
تاريخ التسجيل: Mar 2013
المشاركات: 35
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
|
05-05-2013, 04:24 PM | #6 |
مدون جديد
تاريخ التسجيل: May 2013
المشاركات: 44
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
|
05-09-2013, 08:45 AM | #7 |
مدون نشيط
تاريخ التسجيل: Apr 2013
المشاركات: 113
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
تحميل برامج مجانية |
05-13-2013, 09:59 AM | #8 |
مدون جديد
تاريخ التسجيل: Apr 2013
المشاركات: 13
|
رد: اضافة زر الذهاب إلى أعلى و زر الذهاب إلى الاسفل في بلوجر
__________________
|
مواقع النشر (المفضلة) |
الكلمات الدلالية (Tags) |
أغلي, الاسفل, الذهاب, اضافة, بلوجر |
الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1) | |
|
|
المواضيع المتشابهه | ||||
الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
مشكل بسيط في اعلان أدسنس أعلى الصفحة | مدونة المعرفة | طلبات الدعم الفني | 3 | 04-19-2013 02:16 AM |
الحصول على ميكرونش للحصول على أعلى الأرباح | ma-coder | الربح عن طريق أدسنس | 1 | 03-10-2013 11:53 AM |
أغلي الكلمات الربحية في ادسنس لعام 2013 | saheralialy | الربح عن طريق أدسنس | 0 | 01-24-2013 12:46 AM |
كيفية اضافة مواضيع ذات صلة في بلوجر | بلال حمدان | إضافات وأدوات بلوجر | 0 | 10-03-2012 01:24 PM |
اضافة الأيقونات الإجتماعية أعلى التدوينة | yosefssss | طلبات الدعم الفني | 3 | 08-07-2012 10:56 PM |
الساعة الآن 08:21 PM - بتوقيت جرينتش
المعهد غير مسؤول عن أي اتفاق تجاري أو
تعاوني بين الأعضاء فعلى كل شخص تحمل مسؤولية نفسه تجاه ما يقوم به من بيع وشراء وإتفاق وإعطاء معلومات مدونته التعليقات المنشورة لا تعبر عن رأي معهد خبراء البلوجر ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر) |