موضوع: كود صوره يسار القسم لصاحب الموضوع
تم النشر فى :22 - 05 - 2014
.
كود صوره يسار القسم لصاحب الموضوع
د [Java] [CSS] لوضع صورة في اخر المواضيع بطريقة احترافية للنسخة الثانية
من طرف فرسان المساعدة في الخميس 7 مارس 2013 - 23:14
=274bbd5fc9826293035ee11f2d30dcb2&cvf[1]=aed989832c41a1bc96b3ba522388daf8&eval=plus&p_vote=4646790]+
=764bde8953faf4fef699e730f4c84b22&cvf[1]=6a67478ab9e0f8fdb7ea23b9fea9e497&eval=minus&p_vote=4646790]-
بسم الله الرحمن الرحيم
كود [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; }
الكود في عاية الجمال
فرسان المساعدة
نوع المتصفح:
نسخة المنتدى:
عدد المساهمات: 478
معدل النشاط: 2017
(JAVASCRIPT) لوضع صورة في خانة اخر المساهمة***Mohamed Nsr
من طرف
Mohamed Nsr في الإثنين 16 ديسمبر 2013 - 0:44
=31aece226178406b497164d50eb47a9e&cvf[1]=4cdb9ecce561690071f09bfb66a23822&eval=plus&p_vote=4772595]+
----
=af6e7bf35cdcdbde6fe646e6759ed1e1&cvf[1]=a0e85de9fcabc6728750202940b9d977&eval=minus&p_vote=4772595]-
والصلاة والسلام على افضل الخلق سيدنا محمد عليه افضل الصلاة والسلام
اما بعد
اليوم اتيت لكم بكود جميل جدا الا وهو وضع صورة العضو صاحب اخر مساهمه في القسم
في خانة "اخر مساهمه في الرئيسيه"
الان طريقة وضع الكود
اولا في الجافا
لوحة الاداره>>عناصر اضافيه>>HTML و JAVASCRIPT>>إدارة أكواد Javascript>>انشاء كود جديد
العنوان:كما تريد
اضف الكود الى:جميع الصفحاتكود Javascript * :
الكود: ---------تضليل المحتوى
- الكود:
-
$(function(){
if(!window.localStorage) return;
// Avatar por defecto
var default_avatar= 'http://2img.net/i/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]