منتدى الدعم العربي لمنتديات أحلى منتدى
مرحبا بك في منتدى دعم منتديات AhlaMontada

لتتمكن من الإستمتاع بكافة ما يوفره لك هذا المنتدى من خصائص, يجب عليك أن تسجل الدخول الى حسابك في المنتدى. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه.

انشاء منتدى مجاني شبيه بهذا المنتدى
أحلى الشبكات الإجتماعية

انشاء منتدى مجاني



 انشاء منتدى مجاني

أقسام الدعم

دعم الخدمات العامة:
مشاكل كلمة السر
مشاكل فتح المنتدى
مشاكل لوحة الإدارة
مشاكل تنسيق المظهر
المشاكل الأخرى

----------------------

دعم الخدمات التكميلية :
مشاكل النطاقات
مشاكل التومبلايت

----------------------

مراسلة الإدارة :

طلب كلمة السر
إرسال أكواد أو شروحات
أتصل بنا
كيفية طلب كلمة سر جديدة
> طريقة طلب كلمة سر

تنبيه: لا تضع أبداً ايميل الإنشاء في مساهماتك و لا تعطيه لأحد!
المواضيع الأخيرة
» رابط منتداي يحول الى الادفلاي يرجى رفع للزعيم
اليوم في 4:09 من طرف h.elhadri

» ارجزا من الاخوة والاخوات المساعدة
أمس في 23:07 من طرف ahd allah

» وضع اعلان فى اعلى الصفحه
أمس في 21:35 من طرف ahd allah

» طلب لتغيير ايميل الانشاء
أمس في 20:40 من طرف ahd allah

» طلب بعض الاكواد المهمة جدا
أمس في 20:29 من طرف ahd allah

» وضع صورة
أمس في 19:28 من طرف zaydoon

» مشكلة وكيف الحل
أمس في 18:07 من طرف nesma

» سؤال بغاية الاهمية
أمس في 15:15 من طرف الزعيم

» مشكلة
أمس في 11:46 من طرف الزعيم

أفضل الأعضاء الموسومين
@الزعيم
 
@@
 
@stones
 
@Mohamed Nsr
 
@JAR7
 

عمل منتدى

كود [Java] [CSS] لوضع صورة في اخر المواضيع بطريقة احترافية للنسخة الثانية

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

كود [Java] [CSS] لوضع صورة في اخر المواضيع بطريقة احترافية للنسخة الثانية

مُساهمة من طرف فرسان المساعدة في الجمعة 8 مارس 2013 - 0:14

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

كود [Java] [CSS] لوضع صورة في اخر المواضيع بطريقة احترافية للنسخة الثانية

هذا الكود من تصميم : simoelmaachi

صورة للمعاينة


كود جافا
الرمز:
// Avatar Center by simoelmaachi phpbb2
$(document).on('ready', function() {
    $('.forumline tr .row3.over').prepend('<div class="avatar-simoelmaachi"><div>');
    $('.forumline tr .row3.over .avatar-simoelmaachi').each(function () {
        var profileUser = $(this).parent().children('span').children('span').children('strong').children('a').attr('href');
 
      $(this).html('<a href="' + profileUser + '"
class="avatar-index-enlace"><img
src="http://i35.servimg.com/u/f35/17/45/45/08/12810.png" alt="No Avatar"
 /></a>');
        $(this).children('a').load(profileUser + ' .forumline .row1.gensmall[align="center"]:eq(0) img:eq(0)');
    });
});

وكود السي اس اس
الرمز:
/* Avatar Center by simoelmaachi phpbb2*/
.avatar-simoelmaachi { float: Center; }
.avatar-simoelmaachi img { width: 50px; height: 50px; padding: 2px; border: 2px solid #25EBFF; margin: 0 10px; }
الكود في عاية الجمال


فرسان المساعدة
 
 

انثى
عدد المساهمات : 477
معدل النشاط : 2869

http://montada.ahlamoontada.net/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

(JAVASCRIPT) لوضع صورة في خانة اخر المساهمة***Mohamed Nsr

مُساهمة من طرف Mohamed Nsr في الإثنين 16 ديسمبر 2013 - 1:44

بسم الله الرحمان الر
والصلاة والسلام على افضل الخلق سيدنا محمد عليه افضل الصلاة والسلام
اما بعد
اليوم اتيت لكم بكود جميل جدا الا وهو وضع صورة العضو صاحب اخر مساهمه في القسم 
في خانة "اخر مساهمه في الرئيسيه" 


الان طريقة وضع الكود 
اولا في الجافا
لوحة الاداره>>عناصر اضافيه>>HTML و JAVASCRIPT>>إدارة أكواد Javascript>>انشاء كود جديد
العنوان:كما تريد
اضف الكود الى:جميع الصفحات
كود Javascript * :

الرمز:
$(function(){
 
    if(!window.localStorage) return;
 
    // Avatar por defecto
    var default_avatar= 'http://illiweb.com/fa/invision/pp-blank-thumb.png';
 
    // Tiempo de cache, aqui 24 h * 60 m * 60 s * 1000 ms entonces un dيa
    var caching_time= 24*60*60*1000;
 
    // Tiempo de cache de un error, ici 60 s * 1000 ms entonces un minuto
    var caching_error= 60*1000;
 
    var set_avatar= function(id) {
        $('.mini_ava.member'+id).html('<img src="'+get_avatar(id)+'" />');
    };
 
    var get_avatar= function(id) {
        if(localStorage.getItem('t_ava'+id) < +new Date - caching_time || (localStorage.getItem('d_ava'+id)==default_avatar && localStorage.getItem('t_ava'+id) < +new Date - caching_error))
        {
            localStorage.setItem('d_ava'+id, default_avatar);
            $.get('/u'+id, function (d){
                localStorage.setItem('t_ava'+id,+new Date);
                localStorage.setItem('d_ava'+id, $('#profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img',d).first().attr('src')||default_avatar);
                set_avatar(id);
            });
        }
        return localStorage.getItem('d_ava'+id);
    };
 
    var to_replace= {};
 
    $('dd.lastpost strong a.gensmall, .ipbtable tr td:last-child span strong a.gensmall, .table td.tcr strong a.gensmall, .forumline .row3.over strong a.gensmall').each(function(){
        to_replace[$(this).attr('href').substr(2)]= 1;
        $(this).closest('td,dd').prepend('<div class="mini_ava member'+$(this).attr('href').substr(2)+'"></div>');
    });
 
    for(i in to_replace)
    {
        set_avatar(i);
    };
 
});


ثانيا اكواد ال css
لوحة الاداره>>مظهر المنتدى>>الصور والالوان>>الوان>>ورقة تصميم ال css 
وضع الكود التالي:

الرمز:

.mini_ava {
  float: left;
}
.mini_ava img {
  width: 40px;
  height: 40px;
  margin: 0 5px;
  border-radius: 10px;
  transition: all 2s;
  -moz-transition: all 2s;
  -webkit-transition: all 2s;
  -o-transition: all 2s;
}
.mini_ava img:hover
{
  width: 80px;
  height: 80px;
}
قبل وضع مؤشر الفأره على الصوره:

بهعد وضع مؤشر الفأره على الصوره:
منقول للافاده


وبهذا قد انتهى الشرح
بالتوفيق ليكم
  
تحياتي
[Mohamed Nsr]
فريق المساعدة

Mohamed Nsr
أحلى إشراف
أحلى  إشراف

ذكر
عدد المساهمات : 12749
معدل النشاط : 12327

http://help.ahlamontada.com/forum

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى