كود إضافة زر الصعود إلى أعلى لمدونات بلوجر

كود اضافة زر الصعود الى اعلى على شكل صاروخ بطريقة أحترافية

Back to Top

شرح تركيب الاضافة
1 ندخل الى لوحة التحكم فى بلوجر
2 من ثم نحتار القالب ونختار تحرير Html
3 ونبحث عن ]]></b:skin> ونضيف قبله هذا الكود. و للاظهار مربع البحث اظغط على ctrl + f

/* Back to Top Roket meluncur by mohamed fawzy - time-techno.com*/

#scrolltop{display:none}

#rocketmeluncur{position:fixed;bottom:50px;z-index:7;display:none;visibility:hidden;width:26px;height:48px;right:25px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYgMkLNVN9AvBvwl3c49LCf0UIhzTgprFmAKYnwHjnlsTCNzuYfStrX1WnQMfM_QU-YWFwbGFITIcV6T_3tqGXRfurde9I2V4YSDpDVNYsLC9sy1WdsL6331a3L4iXTXNBv7M1-O8jOMRv/s1600/time+techno.png) 50% 0 no-repeat;opacity:0;-webkit-transition:visibility .6s cubic-bezier(.6,.04,.98,.335),opacity .6s cubic-bezier(.6,.04,.98,.335),-webkit-transform .6s cubic-bezier(.6,.04,.98,.335);-moz-transition:visibility .6s cubic-bezier(.6,.04,.98,.335),opacity .6s cubic-bezier(.6,.04,.98,.335),-moz-transform .6s cubic-bezier(.6,.04,.98,.335);transition:visibility .6s cubic-bezier(.6,.04,.98,.335),opacity .6s cubic-bezier(.6,.04,.98,.335),transform .6s cubic-bezier(.6,.04,.98,.335)}

#rocketmeluncur i{display:block;margin-top:48px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYgMkLNVN9AvBvwl3c49LCf0UIhzTgprFmAKYnwHjnlsTCNzuYfStrX1WnQMfM_QU-YWFwbGFITIcV6T_3tqGXRfurde9I2V4YSDpDVNYsLC9sy1WdsL6331a3L4iXTXNBv7M1-O8jOMRv/s1600/time+techno.png) 50% -48px no-repeat;opacity:.5;-webkit-transition:-webkit-transform .2s;-moz-transition:-moz-transform .2s;transition:transform .2s;-webkit-transform-origin:50% 0;-moz-transform-origin:50% 0;transform-origin:50% 0}

#rocketmeluncur:hover{background-position:50% -62px}

#rocketmeluncur:hover i{background-position:50% 100%;-webkit-animation:flaming .7s infinite;-moz-animation:flaming .7s infinite;animation:flaming .7s infinite}#rocketmeluncur.showrocket{visibility:visible;opacity:1}

#rocketmeluncur.launchrocket{background-position:50% -62px;opacity:0;-webkit-transform:translateY(-800px);-moz-transform:translateY(-800px);-ms-transform:translateY(-800px);transform:translateY(-800px);pointer-events:none}

#rocketmeluncur.launchrocket i{background-position:50% 100%;-webkit-transform:scale(1.4,3.2);-moz-transform:scale(1.4,3.2);transform:scale(1.4,3.2)}

4 ثم نبحث عن </body> ونضيف قبله هذا الكود

وقم بحفظ القالب ومبروك عليك الأضافة والشكل الرائع لمدونتك

دمتم بخير