جاري التحميل
المواضيع الأخيرة
أفضل 10 أعضاء في هذا الأسبوع
omarpop23
 
JoryAbdallah
 
khairanynabil
 
نورالدين خلف
 
BAZOKA Libya
 
game4rest
 

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

لا أحد

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


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

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

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

تومبلايت الغاء ازرار كتابة موضوع وجعلها نصية واضافة تاثير css

avatar
تومبيلات الغاء ازرار كتابة موضوع وجعلها نصية واضافة تاثير css

تومبيلات الغاء ازرار كتابة موضوع وجعلها نصية واضافة تاثير css

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

اقدم اليوم حاجة جديدة وهي الغاء صور ازرار الكتابة ( كتابة موضوع جديد - اضافة رد )

وجعلها ازرار نصية مع اضافة تاثيرات عليها بتقنية css

او نفتح قالب viewtopic_body

ونبحث عن ,,

الكود:
            <!-- BEGIN switch_user_authpost -->
            <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}Newtopic" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a>&nbsp;&nbsp;&nbsp;
            <!-- END switch_user_authpost -->
            <!-- BEGIN switch_user_authreply -->
            <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
            <!-- END switch_user_authreply -->

ونستبدله بــ

الكود:
        <!-- BEGIN switch_user_authpost -->
         <tr>   <div class="topic_en"><a href="{U_POST_NEW_TOPIC}" rel="nofollow" class="topic_1">موضوع جديد</a>
        <!-- END switch_user_authpost -->
</div>      </tr>
        <!-- BEGIN switch_user_authreply -->
        <div class="topic_en"><a href="{U_POST_REPLY_TOPIC}"rel="nofollow" class="topic_1">أضافة رد</a>
        <!-- END switch_user_authreply -->
          </div>      

ثم مرة اخرى نكرر نفس الاستبدال بالقالب لانه مكرر مرتين

ثم حفظ ثم نشر

ثم بورقة css نضع الكود الاتي

الكود:


.topic_en {

margin-left: 15px;
  
background: #00a1cb;

height: 37px;
  
width: 129px;
  
float: right;
  
font-family: Sans-serif;

font-size: 18px;

text-align: center;

transition: all 0.3s ease 0s;

-webkit-transition:300ms;

border:none!important;
  
border-radius:3px;

color:#FFF!important;

padding:5px 10px!important;

}


.topic_en:hover  {

background: #0190b5;
 
height: 37px;
  
width: 129px;
  
float: right;
  
font-family: Sans-serif;

font-size: 18px;

text-align: center;

transition: all 0.3s ease 0s;

-webkit-transition:300ms;

border:none!important;
  
border-radius:3px;

color:#FFF!important;

padding:5px 10px!important;
 
}

صورة للعملية بعد تعديل بالقالب ووضع الكود بورقة css



http://i61.tinypic.com/mb7d5y.jpg

وهذا تاثير اخر بكود css يجعل الزرين بخلفية ووتتغير الخلفية بشكل انسيابي

الكود css

الكود:


.topic_en {

margin-left: 15px;
  
background-image: url(http://i21.servimg.com/u/f21/16/46/77/76/uo_ouo19.png);
  
background-repeat: no-repeat;
  
height: 37px;
  
width: 129px;
  
float: right;
  
font-family: Sans-serif;

font-size: 18px;

text-align: center;

}


.topic_en:hover  {

background-image: url(http://i21.servimg.com/u/f21/16/46/77/76/uo_ouo19.png);
  
background-repeat: no-repeat;
  
background-position: 0px -37px;
 
font-family: Sans-serif;

font-size: 18px;

text-align: center;

}

صورة للتوضيح



http://i59.tinypic.com/5lnrip.gif

دمتم بخير


m13
يعطيك آلف عافيه ع هالموضوع
وسلمت الآنامل المتألقه 
avatar
مجهود روعه
تسلمي ي جوري
avatar
منور الموضوع


m13
avatar
شكرا ع الكود الاكثر من رائع


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


avatar
كالعادة ابداع رائع 
وطرح يستحق المتابعة
شكراً لك 
بانتظار الجديد القادم
دمت بكل خير

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

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

انشئ حساب

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


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

تسجل دخول

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


تسجيل دخول