جاري التحميل
المواضيع الأخيرة
أفضل 10 أعضاء في هذا الأسبوع
JoryAbdallah
 
omarpop23
 
وهبة الساحر
 
عبدالله الوكيل
 
dyadoura
 
medoman2020
 

المتواجدون الآن ؟
ككل هناك 15 عُضو متصل حالياً :: 1 أعضاء, 0 عُضو مُختفي و 14 زائر :: 1 روبوت الفهرسة في محركات البحث

AsHeK EgYpT

[ مُعاينة اللائحة بأكملها ]


أكبر عدد للأعضاء المتواجدين في هذا المنتدى في نفس الوقت كان 141 بتاريخ 19/07/16, 08:08 am
احصائيات
هذا المنتدى يتوفر على 486 عُضو.
آخر عُضو مُسجل هو khairanynabil فمرحباً به.

أعضاؤنا قدموا 9739 مساهمة في هذا المنتدى في 1842 موضوع

منتديات تقنيات :: جاليري استايلات التومبلايت والقوالب والاكواد :: 

حصري المفاجئة القنبلة المتميزة الحصرية اداة في أسفل المنتدى تلقائية الاشتغال بشكل متميز ورااائع

السلام عليكم ورحمة الله وبركاته 

بسم الله الرحمان الرحيم 

اليوم نأتي بكود جميل ومميز وراااااااااااااااااائع جبار وخيالي حصريا لاول مرة على منتدي تقنيات 

سادعكم تكتشفون الكود بنفسكم 

الكود وطبريقة تركيبه 

لوحة الإدارة / مظهر المنتدى / التومبيلات و القوالب / ادارة عامة 

تم الى قالب الهيدر : overall_header

نبحث عن 

الكود:
{JAVASCRIPT}



ونضيف اسفله مباشرة الكود التالي 
الكود:
<style>
.c-circle-nav__toggle,.c-circle-nav__toggle span{transition:background .3s;-webkit-transition:background .3s}.c-circle-nav{position:fixed;bottom:12px;right:12px;z-index:1000;width:48px;height:48px;border-radius:24px}@media (min-width:480px)and (min-height:480px){.c-circle-nav{width:96px;height:96px;border-radius:48px}}.c-circle-nav__items{display:block;list-style:none;z-index:90;margin:0;padding:0}.c-circle-nav__item{display:block;position:absolute;top:0;left:0;width:48px;height:48px;border-radius:24px;opacity:0;-webkit-transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-transition-duration:.3s,.3s;transition-duration:.3s,.3s;-webkit-transition-timing-function:cubic-bezier(.35,-.59,.47,.97);transition-timing-function:cubic-bezier(.35,-.59,.47,.97)}.c-circle-nav__item:nth-child(1){-webkit-transition-delay:.4s;transition-delay:.4s}.c-circle-nav__item:nth-child(2){-webkit-transition-delay:.3s;transition-delay:.3s}.c-circle-nav__item:nth-child(3){-webkit-transition-delay:.2s;transition-delay:.2s}.c-circle-nav__item:nth-child(4){-webkit-transition-delay:.1s;transition-delay:.1s}.c-circle-nav__item:nth-child(5){-webkit-transition-delay:0s;transition-delay:0s}.c-circle-nav.is-active .c-circle-nav__item{-webkit-transition-timing-function:cubic-bezier(.35,.03,.47,1.59);transition-timing-function:cubic-bezier(.35,.03,.47,1.59);opacity:1}.c-circle-nav.is-active .c-circle-nav__item:nth-child(1){-webkit-transition-delay:0s;transition-delay:0s;-webkit-transform:translate(-144px,0);-ms-transform:translate(-144px,0);transform:translate(-144px,0)}@media (min-width:480px)and (min-height:480px){.c-circle-nav__item{width:96px;height:96px;border-radius:48px!important}.c-circle-nav.is-active .c-circle-nav__item:nth-child(1){-webkit-transform:translate(-288px,0);-ms-transform:translate(-288px,0);transform:translate(-288px,0)}}.c-circle-nav.is-active .c-circle-nav__item:nth-child(2){-webkit-transition-delay:.1s;transition-delay:.1s;-webkit-transform:translate(-134px,-56px);-ms-transform:translate(-134px,-56px);transform:translate(-134px,-56px)}@media (min-width:480px)and (min-height:480px){.c-circle-nav.is-active .c-circle-nav__item:nth-child(2){-webkit-transform:translate(-267px,-111px);-ms-transform:translate(-267px,-111px);transform:translate(-267px,-111px)}}.c-circle-nav.is-active .c-circle-nav__item:nth-child(3){-webkit-transition-delay:.2s;transition-delay:.2s;-webkit-transform:translate(-102px,-102px);-ms-transform:translate(-102px,-102px);transform:translate(-102px,-102px)}@media (min-width:480px)and (min-height:480px){.c-circle-nav.is-active .c-circle-nav__item:nth-child(3){-webkit-transform:translate(-204px,-204px);-ms-transform:translate(-204px,-204px);transform:translate(-204px,-204px)}}.c-circle-nav.is-active .c-circle-nav__item:nth-child(4){-webkit-transition-delay:.3s;transition-delay:.3s;-webkit-transform:translate(-56px,-134px);-ms-transform:translate(-56px,-134px);transform:translate(-56px,-134px)}@media (min-width:480px)and (min-height:480px){.c-circle-nav.is-active .c-circle-nav__item:nth-child(4){-webkit-transform:translate(-111px,-267px);-ms-transform:translate(-111px,-267px);transform:translate(-111px,-267px)}}.c-circle-nav.is-active .c-circle-nav__item:nth-child(5){-webkit-transition-delay:.4s;transition-delay:.4s;-webkit-transform:translate(0,-144px);-ms-transform:translate(0,-144px);transform:translate(0,-144px)}.c-circle-nav__link{display:block;width:100%;height:100%;border-radius:24px!important;box-shadow:inset 0 0 0 2px #fff}@media (min-width:480px)and (min-height:480px){.c-circle-nav.is-active .c-circle-nav__item:nth-child(5){-webkit-transform:translate(0,-288px);-ms-transform:translate(0,-288px);transform:translate(0,-288px)}.c-circle-nav__link{border-radius:48px!important}}.c-circle-nav__link img{display:block;max-width:100%;height:auto}.c-circle-nav__link:hover{box-shadow:inset 0 0 0 2px #ff283c}.c-circle-nav__toggle{display:block;position:absolute;z-index:100;margin:0;padding:0;width:48px;height:48px;background-color:#ff283c;font:inherit;font-size:0;text-indent:-9999px;border-radius:24px!important;cursor:pointer;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none}@media (min-width:480px)and (min-height:480px){.c-circle-nav__toggle{width:96px;height:96px;border-radius:48px!important}}.c-circle-nav__toggle.is-active,.c-circle-nav__toggle:focus,.c-circle-nav__toggle:hover{outline:0;background-color:#c10012}.c-circle-nav__toggle span,.c-circle-nav__toggle span::after,.c-circle-nav__toggle span::before{display:block;position:absolute;height:4px;background:#fff;border-radius:1px!important}.c-circle-nav__toggle span{top:22px;left:10px;right:10px}@media (min-width:480px)and (min-height:480px){.c-circle-nav__toggle span,.c-circle-nav__toggle span::after,.c-circle-nav__toggle span::before{height:8px;border-radius:2px!important}.c-circle-nav__toggle span{top:44px;left:20px;right:20px}}.c-circle-nav__toggle span::after,.c-circle-nav__toggle span::before{left:0;width:100%;content:"";-webkit-transition-duration:.3s,.3s;transition-duration:.3s,.3s;-webkit-transition-delay:.3s,0s;transition-delay:.3s,0s}.c-circle-nav__toggle span::before{top:-8px;-webkit-transition-property:top,-webkit-transform;transition-property:top,transform}.c-circle-nav__toggle span::after{bottom:-8px;-webkit-transition-property:bottom,-webkit-transform;transition-property:bottom,transform}@media (min-width:480px)and (min-height:480px){.c-circle-nav__toggle span::before{top:-16px}.c-circle-nav__toggle span::after{bottom:-16px}}.c-circle-nav__toggle.is-active span{background:0 0}.c-circle-nav__toggle.is-active span::before{top:0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition-delay:0s,.3s;transition-delay:0s,.3s}.c-circle-nav__toggle.is-active span::after{bottom:0;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition-delay:0s,.3s;transition-delay:0s,.3s}.c-mask{position:fixed;top:0;left:0;z-index:900;visibility:hidden;opacity:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);-webkit-transition:opacity .3s,visibility .3s;transition:opacity .3s,visibility .3s}.c-mask.is-active{opacity:1;visibility:visible}

</style>
<nav id="c-circle-nav" class="c-circle-nav">
  <button id="c-circle-nav__toggle" class="c-circle-nav__toggle">
    <span>Toggle</span>
  </button>
  <ul class="c-circle-nav__items">
    <li class="c-circle-nav__item">
      <a href="/forum" class="c-circle-nav__link">
        <img src="http://callmenick.com/_development/css-circle-menu/img/house.svg" alt="" />
      </a>
    </li>
    <li class="c-circle-nav__item">
      <a href="profile?mode=editprofile&page_profil=avatars" class="c-circle-nav__link">
        <img src="http://callmenick.com/_development/css-circle-menu/img/photo.svg" alt="" />
      </a>
    </li>
    <li class="c-circle-nav__item">
      <a href="viewonline" class="c-circle-nav__link">
        <img src="http://callmenick.com/_development/css-circle-menu/img/pin.svg" alt="" />
      </a>
    </li>
    <li class="c-circle-nav__item">
      <a href="search" class="c-circle-nav__link">
        <img src="http://callmenick.com/_development/css-circle-menu/img/search.svg" alt="" />
      </a>
    </li>
    <li class="c-circle-nav__item">
      <a href="profile?mode=editprofile" class="c-circle-nav__link">
        <img src="http://callmenick.com/_development/css-circle-menu/img/tools.svg" alt="" />
      </a>
    </li>
  </ul>
</nav>
<script src="http://yassine-bablil.allgoo.net/10294.js"></script>
avatar
طرحت فأبدعت يعطيك الف عافية
جهود مبارك جزاك الله خير
دمت ودام عطائك
ودائما بأنتظار جديدك الشيق
لك خالص تقديري واحترامي
دمت بخير


m13
avatar
بارك الله فيك ع مجهودك
تقبل مروري


avatar
شششكرآ على الكود #بلآك
  


avatar
واااااو الأداة روعة ـ تم تركيبها في منتداي للتجربة فقط لكنها أعجبتني و سأبقي عليها هههه
مشكور يا بطل ــ ننتظر جديدك
avatar
كل الشكر والامتنان على روعهـ بوحـكـ
..
وروعهـ مانــثرت .. وجماليهـ طرحكـ
..
avatar
شششكرآ على الكود #بلآك
  

سجل دخولك أو انشئ حساب لترك رد

تحتاج إلى أن تكون عضوا من أجل ترك الرد.

انشئ حساب

الانضمام إلى مجتمعنا من خلال إنشاء حساب جديد. من السهل


انشئ حساب جديد

تسجل دخول

هل لديك حساب بالفعل؟ لا توجد مشكلة، قم بتسجيل الدخول هنا.


تسجيل دخول