اَضاَفة شريط تنبية مـتحرك اَحتراَفى لمـدووناَت بلووجر





الرئيسية > اَضاَفاَت بلووجر > بلووجر > شائع

اَلسلاَمـ عليكمـ مـرحباَ بكمـ في مـدوونة دكتوور تكنوولووجي اَليوومـ اَقدمـ لكمـ اَضاَفة راَئعة عباَرة عن شريط تنبيه تضع فيه اَي جديد حوول اَلمـدوونة وويلفت اَنتباَه اَلزاَئر ووعنداَ ضغط على اَخفاَء اَلشريط ب علاَمـة X يضهر زر اَخر على شكل ↓ يعيد لك اَلشريط بطريقة سلسة راَئعة

يمـكنك مـعاَينة اَلاَضاَفة مـن هناَ

اَلاَن نتجه لتركيب اَلاَضاَفة

إبحث على </head> ووضع هذاَ اَلكوود فووقه

<style>.bar_abdoutech{width: 100%; margin: 0; height: 50px; display: table; font-size: 17px; line-height: 50px; font-weight: 600; -webkit-font-smoothing: antialiased; color: rgb(255, 255, 255);     font-family: inherit; border-color: rgb(255, 255, 255); background-color: #3b78e7; box-shadow: 0 1px 3px 2px rgba(0,0,0,0.15);     text-align: center;} .bar_abdoutech .bar-but{font-size: 17px; font-weight: bold; margin-right: 25px; background: #fff; padding: 5px; color: #fff; background-color: #f2132d; line-height: 1.05; padding: 4px 15px; cursor: pointer; text-decoration: none; border-radius: 3px;} .bar_abdoutech .bar-but a{color:#fff;    text-decoration: none;} .bar_abdoutech i { float: right; padding-right: 40px; cursor: pointer; line-height: 50px; } body{margin-top:-49.33px;} body{margin-top:49.33px ;transition:600ms;-webkit-transition:600ms;-moz-transition:600ms;-o-transition:600ms;} .toggleclose{top:-75px!important;} .togglebody{margin-top:0!important;} .fa-arrow-down { position: fixed; right: 30px; top: -2px; background:#3b78e7; color: #FFFFFF; width: 40px; height: 30px; border-radius: 3px; line-height: 12px!important; padding-top: 10px; padding-right: 0!important; } .bar_abdoutech{z-index:99999;top:0;transition:600ms;-webkit-transition:600ms;-moz-transition:600ms;-o-transition:600ms;position:fixed} .abdoutech_com { color:#f2132d; margin-left:10px;     -webkit-animation-name: blinker;     -webkit-animation-duration: 1s;     -webkit-animation-timing-function: linear;     -webkit-animation-iteration-count: infinite;          -moz-animation-name: blinker;     -moz-animation-duration: 1s;     -moz-animation-timing-function: linear;     -moz-animation-iteration-count: infinite;          animation-name: blinker;     animation-duration: 1s;     animation-timing-function: linear;     animation-iteration-count: infinite; }  @-moz-keyframes blinker {       0% { opacity: 1.0; }     50% { opacity: 0.0; }     100% { opacity: 1.0; } }  @-webkit-keyframes blinker {       0% { opacity: 1.0; }     50% { opacity: 0.0; }     100% { opacity: 1.0; } }  @keyframes blinker {       0% { opacity: 1.0; }     50% { opacity: 0.0; }     100% { opacity: 1.0; } } @media screen and (max-width:800px) { .bar_abdoutech{display:none;} body {     margin-top: 0;     } } </style><script>//<![CDATA[   jQuery(document).ready(function(){     jQuery( '.bar_abdoutech i' ).click(function() {   jQuery( '.bar_abdoutech' ).toggleClass( 'toggleclose' );   jQuery( 'body' ).toggleClass( 'togglebody' );   jQuery( '.bar_abdoutech i' ).toggleClass( 'fa-times' );   jQuery( '.bar_abdoutech i' ).toggleClass( 'fa-arrow-down' );  });  }); //]]></script>

اَلاَن إبحث على <body> ووضع هذاَ تحته

عن آيت أحمد عبدالنور

آيت أحمد عبدالنور, مصمم ومطور مواقع ومدون ذو خبرة قررت انشاء هذة المدونة لنشر العلم والفائدة،اتمنى ان اقدم لكم الافضل ..