هذه مُجرَّد مُعاينة لتصميم تم اختياره من موقع Hitskin.com
تنصيب التصميم في منتداك • الرجوع الى صفحة بيانات التصميم
مشكله في كود اعادة تحجيم الصور
2 مشترك
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: دعم مشاكل التومبلايت و الأكواد :: أرشيف قسم "مشاكل التومبلايت و الأكواد"
صفحة 1 من اصل 2
صفحة 1 من اصل 2 • 1, 2
مشكله في كود اعادة تحجيم الصور
المشكله هي ان الكود يظهر بشكل خاطئ يعني لايظهر فوق الصورة في بعض الاحيان وحجمه يظهر صغيراً بحيث الكتابة تكون متقسمة بشكل غبي
صور لتوضيح المشاكل
مشكلة الكتابة تكون مقسمة بشكل غبي في الصور الصغيرة (واصلا لماذا الكود يظهر في الصور الصغيرة؟)
مشكلة ان الكود لايظهر فوق الصور بشكل صحيح
هذا الكود يقوم باعادة تحجيم الصور
صور لتوضيح المشاكل
مشكلة الكتابة تكون مقسمة بشكل غبي في الصور الصغيرة (واصلا لماذا الكود يظهر في الصور الصغيرة؟)
مشكلة ان الكود لايظهر فوق الصور بشكل صحيح
هذا الكود يقوم باعادة تحجيم الصور
- الكود:
(function() {
window.fa_img_resizer = {
max_width : 400, // maximum image width (400px)
max_height : 250, // maximum image height (250px)
selector : '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options : {
bar : true, // resized image options bar
toggler : true, // Enlarge / Reduce Image
full_size : true, // Show full size
download : true, // Download image link
lightbox : true // lightbox effect
},
// texts
lang : {
full_size : '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge : '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce : '<i class="fa fa-search-minus"></i> تصغير الصورة',
download : '<i class="fa fa-download"></i> تحميل الصورة',
tooltip : 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize : function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapper with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentHTML('beforebegin',
'<div class="fa_img_resizer" style="width:' + (a[i].width - 8) + 'px;">'+
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '')+
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '')+
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '' )+
'</div>'
);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle : function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox : function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox : function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
عدل سابقا من قبل المبدع الخبير في الثلاثاء 22 أكتوبر 2024 - 21:58 عدل 1 مرات
رد: مشكله في كود اعادة تحجيم الصور
اهلا
جرب هذا
جرب هذا
- الكود:
(function() {
window.fa_img_resizer = {
max_width : 400, // maximum image width (400px)
max_height : 250, // maximum image height (250px)
selector : '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img,.post-content > div:not(img.emotiuser_icon.fa_img_reduced), .message-text img', // where images should be resized
options : {
bar : true, // resized image options bar
toggler : true, // Enlarge / Reduce Image
full_size : true, // Show full size
download : true, // Download image link
lightbox : true // lightbox effect
},
// texts
lang : {
full_size : '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge : '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce : '<i class="fa fa-search-minus"></i> تصغير الصورة',
download : '<i class="fa fa-download"></i> تحميل الصورة',
tooltip : 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize : function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapper with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentHTML('beforebegin',
'<div class="fa_img_resizer" style="width:' + (a[i].width - 8) + 'px;">'+
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '')+
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '')+
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '' )+
'</div>'
);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle : function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox : function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox : function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
رد: مشكله في كود اعادة تحجيم الصور
اهلا اخي كونان الكود خرب المواضيع صارت تظهر في الجنب اليمين وتخرج من مكان الموضوعكونان2000 كتب:اهلا
جرب هذا
- الكود:
(function() {
window.fa_img_resizer = {
max_width : 400, // maximum image width (400px)
max_height : 250, // maximum image height (250px)
selector : '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img,.post-content > div:not(img.emotiuser_icon.fa_img_reduced), .message-text img', // where images should be resized
options : {
bar : true, // resized image options bar
toggler : true, // Enlarge / Reduce Image
full_size : true, // Show full size
download : true, // Download image link
lightbox : true // lightbox effect
},
// texts
lang : {
full_size : '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge : '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce : '<i class="fa fa-search-minus"></i> تصغير الصورة',
download : '<i class="fa fa-download"></i> تحميل الصورة',
tooltip : 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize : function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapper with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentHTML('beforebegin',
'<div class="fa_img_resizer" style="width:' + (a[i].width - + 'px;">'+
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '')+
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '')+
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '' )+
'</div>'
);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle : function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox : function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox : function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
رد: مشكله في كود اعادة تحجيم الصور
اعتذر
رجع الكود السابق
وضع قالب مواضيع منتداك
رجع الكود السابق
وضع قالب مواضيع منتداك
ابوعلي البلقاوي يعجبه هذا الموضوع
رد: مشكله في كود اعادة تحجيم الصور
تفضل اخي كونان هذا الكود من تصميمك مع بعض التعديلات
الكود طويل لهذا سأقوم بارساله على مرتين
النصف الاول
الكود طويل لهذا سأقوم بارساله على مرتين
النصف الاول
- الكود:
<!-- code license by pirates-revo.com -->
<script type="text/javascript">
var CopyrightNotice='The last Topics category for forumotion. Copyright :copyright: ';
$(function () {
$.ajax({
url: "/feed/?f={FORUM_ID}",
success: function (a) {
$(".post-content:first").after('<center><br /> <div align="center" class="postbody"> الموضوع الأصلي : <a href="topic-t{TOPIC_ID}.htm">{TOPIC_TITLE}
</a> //
المصدر: <a href="/">ثورة القراصنة</a>
</div><div class="clear"></div><div class="clear"></div><div class="clear_both"></div><div style="width:90%;background:#eee;border:1px solid #ddd;padding:4px;margin-top:5px; font-size: 13px; font-family: Tahoma;font-weight: bold;"><br /><div id="cungchuyenmuc" style="font-weight: bold;padding:10px 20px;background:#fff;border:1px solid #ddd;"><div class="title">اخر مواضيع القسم</div><br /></div></div></center>');
12 < $(a).find("title").length ? so = 12 : so = $(a).find("title").length;
for (i = 2; i < so; i++) $('<a href="' + $(a).find("link:eq(" + i + ")").text() + '">' + $(a).find("title:eq(" + i + ")").text() + "</a><br/>").appendTo("#cungchuyenmuc")
}
})
});
</script>
<!-- code license by pirates-revo.com -->
<!-- BEGIN switch_plus_menu -->
<script type="text/javascript">
//<![CDATA[
var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}';
</script>
<!-- END switch_plus_menu -->
<script type="text/javascript">
var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
showHiddenMessage = function(id)
{
try
{
var regId = parseInt(id, 10);
if( isNaN(regId) ) { regId = 0; }
if( regId > 0)
{
$('.post--' + id).parent().toggle(0, function()
{
if( $(this).is(":visible") )
{
$('#hidden-title--' + id).html(hiddenMsgLabel.visible);
}
else
{
$('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
}
});
}
}
catch(e) { }
return false;
};
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
(function() {
window.faMentionAvatar = {
// position modifies the position of the avatar
// 0 = before mention
// 1 = after mention
position : 0,
cacheTime : 1*60*60*1000, // amount of time the avatar is cached ( 1 hour )
mentions : null, // mention node list
index : -1, // current index in the mentions array
// checks if the mention is valid and then gets the avatar
getter : function() {
var mention = faMentionAvatar.mentions[++faMentionAvatar.index],
storage = window.localStorage,
id;
if (mention) {
id = mention.href.replace(/.*?\/u/, '');
if (storage && storage['mentionAvatar_' + id] && storage['mentionAvatar_' + id + '_exp'] > +new Date - faMentionAvatar.cacheTime) {
var avatar = document.createElement('IMG');
avatar.className += ' mention-ava';
avatar.src = storage['mentionAvatar_' + id];
faMentionAvatar.position ? mention.appendChild(avatar) : mention.insertBefore(avatar, mention.firstChild);
faMentionAvatar.getter();
} else {
$.get('/ajax/index.php?f=m&user_id=' + id, function(d) {
var avatar = $('.tooltip-content > img', d)[0];
if (avatar) {
faMentionAvatar.position ? mention.appendChild(avatar) : mention.insertBefore(avatar, mention.firstChild);
if (storage) {
storage['mentionAvatar_' + id] = avatar.src;
storage['mentionAvatar_' + id + '_exp'] = +new Date;
}
}
faMentionAvatar.getter();
});
}
}
}
};
// write the stylesheet into the HEAD section
document.write('<style type="text/css">
.fa_like_div img { height:25px; width:25px; vertical-align:middle; border-radius:10px; background:#d7c8c8; margin:1px 3px; padding:1px; }
</style>');
// statements that need execution when the document is ready
$(function() {
faMentionAvatar.mentions = $('.fa_like_div [href*="/u"]');
faMentionAvatar.getter();
});
}());
//]]>
</script>
<style type="text/css">
.ShareScreen {
background: none repeat scroll 0px 0px #FFF;
border: 1px solid #E8E8E8;
border-radius: 5px;
font-family: "Droid Arabic Kufi","Open Sans",sans-serif;
font-size: 0.75em;
font-weight: lighter;
padding: 8px;
margin-top: 10px;
overflow: hidden;
min-height: 10px;
}
.ShareScreen .IconShare {
float: right;
font-size: 36px;
width: 50px;
height: 46px;
margin-left: 10px;
border-radius: 5px;
background: none repeat scroll 0% 0% #5E7081;
color: #FFF;
text-align: center;
padding-top: 9px;}
.ShareScreen .ShareList {
float: right;
margin-left: 10px;}
#logged_out_reply {
text-align: center;}
.content-block, .panel, .module {
color: #333;
background: #EEE;
border: 1px solid #CCC;
margin: 15px 0;}
.lor_maintitle, .lor_subtitle {
color: #000;
font-size: 36px;
font-weight: normal;
margin: 20px 3px 6px 3px;}
.lor_maindesc, .lor_subdesc {
color: #999;
font-size: 14px;
margin: 3px;}
.lor_panel {
background: #FFF;
border: 1px solid #DDD;
display: inline-block;
margin: 1%;
padding: 1%;
width: 45%;}
@media (min-width: 0px) and (max-width: 768px) {
.lor_panel {
display: block;
width: 90%;
margin: 6px auto;}
.lor_maintitle {
font-size: 24px; }}
</style>
<main id="topic">
<div class="topic-header">
<h1><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></h1>
<!-- BEGIN switch_user_authpost -->
<a href="{U_POST_NEW_TOPIC}" rel="nofollow" title="{T_POST_NEW_TOPIC}" {S_POST_NEW_TOPIC} class="btn btn-default mobile-hidden">
<i class="material-icons">{I_POST_NEW_TOPIC}</i>
<span>{L_POST_NEW_TOPIC}</span>
</a>
<!-- END switch_user_authpost -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}" title="{T_POST_REPLY_TOPIC}" {S_POST_REPLY_TOPIC} class="btn btn-default">
<i class="material-icons">{I_POST_REPLY_TOPIC}</i>
<span>{L_POST_REPLY_TOPIC}</span>
</a>
<!-- END switch_user_authreply -->
{POSTERS_LIST}
<div id="breadcrumbs" class="breadcrumbs-topic">
<a href="{U_INDEX}"><i class="material-icons">home</i> <span>{L_INDEX}</span></a>
{NAV_CAT_DESC}
</div>
<!-- BEGIN topicpagination -->
<div class="pagination">
{PAGINATION}
</div>
<!-- END topicpagination -->
</div>
<div class="topic-actions">
<div class="topic-actions-buttons">
<!-- BEGIN switch_plus_menu -->
<div class="plus-menu-wrap">
<script type="text/javascript">//<![CDATA[
var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
insert_plus_menu_new('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
//]]>
</script>
</div>
<!-- END switch_plus_menu -->
<!-- BEGIN switch_twitter_btn -->
<span>
<a href="https://twitter.com/share" class="twitter-share-button" data-via="{TWITTER}">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
</span>
<!-- END switch_twitter_btn -->
<!-- BEGIN switch_fb_likebtn -->
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></span>
<!-- END switch_fb_likebtn -->
<!-- BEGIN switch_plus_menu -->
<div id="addthis-toolbar">
<div class="btn-floating-left" tabindex="100">
{L_SHARE}
</div>
<div class="addthis-toolbar-btn" style="position:absolute; z-index:1000; display: none; background-color: #fff;">
{switch_plus_menu.SOCIAL_BUTTONS}
</div>
</div>
{switch_plus_menu.JS_SOCIAL_BUTTONS}
<!-- END switch_plus_menu -->
</div>
</div>
<!-- BEGIN switch_isconnect -->
<div class="quick-nav-topics">
<a href="{U_VIEW_OLDER_TOPIC}" title="{L_VIEW_PREVIOUS_TOPIC}"><i class="material-icons">chevron_left</i><span>{L_PREVIOUS}</span></a>
<a href="{U_VIEW_NEWER_TOPIC}" title="{L_VIEW_NEXT_TOPIC}" style="float: right;"><span>{L_NEXT}</span><i class="material-icons">chevron_right</i></a>
</div>
<!-- END switch_isconnect -->
{POLL_DISPLAY}
<!-- code license by pirates-revo.com -->
<div class="post-COUNT">
<div class="smbox">
<a target="_blank" href="https://twitter.com/intent/tweet?url=https://pirates-revo.forummo.com/t{TOPIC_ID}-topic">
<span class="liker hint--left" aria-label="إرسال إلى منصة X">
<img src="https://forum.kooora.com/logos/x.png" style="height:38px; width:38px; border: 1px solid gray;">
</span>
</a>
<span class="liker hint--left" aria-label="إرسال إلى منصة فيسبوك">
<a target="_blank" href="https://www.facebook.com/sharer.php?u=https://pirates-revo.forummo.com/t{TOPIC_ID}-topic">
<img src="https://forum.kooora.com/logos/fb.png" style="height:38px; width:38px; border: 1px solid gray;">
</a>
</span>
<span class="liker hint--left" aria-label="إرسال إلى واتس آب">
<a target="_blank" href="https://api.whatsapp.com/send?text=https://pirates-revo.forummo.com/t{TOPIC_ID}-topic">
<img src="https://forum.kooora.com/logos/wa.png" style="height:38px; width:38px; border: 1px solid gray;">
</a>
</span>
<span class="liker hint--left" aria-label="إرسال إلى تلغرام">
<a target="_blank" href="https://t.me/share/url?url=https://pirates-revo.forummo.com/t{TOPIC_ID}-topic">
<img src="https://forum.kooora.com/logos/tg.png" style="height:38px; width:38px; border: 1px solid gray;">
</a>
</span>
</div></div>
<!-- code license by pirates-revo.com -->
<div class="post-COUNT">
<script>document.write('<style type="text/css">.post-COUNT { text-align: center; border: solid #00000040 1px; margin: 10px; padding: 5px; border-radius: 10px; background: #fff;}.qonan2000 { position: relative; display: inline-block;} .qonan2000-content { display: none; position: absolute; background-color: #f9f9f9; width: 140px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 999999;} .close-btn-h1 { position: absolute; right: 0; top: 10px; cursor: pointer; line-height: 0; font-size: 30px; font-weight: bold; color: red;} button.qonan2000-btn-h1 { border: solid #00000040 1px; margin-right: 13px; padding: 5px;}.conan20000-post,.konan2000-content,.konann2000-content, .conan2000-post{ cursor: pointer; padding: 7px;} .conan20000,.konan2000,.konann2000,.conan2000 { border: solid 1px #0000006b; background: white; margin: 4px; display: inline-block;} div#konan2000-Default,div#konann2000-Default,div#conan2000-Default,div#conan20000-Default { cursor: pointer; background: #0000; border: solid 1px #0000004a; width: 100%; margin: 0;} .conan2000:hover, .conan20000:hover,.konan2000:hover,.konan2000:hover { background: #0000003d !important;} blockquote,blockquote font, .quote_content font,dl.codebox {color: initial;} </style>');</script>
<!-- لون المساهمات -->
<div class="qonan2000">
<button class="qonan2000-btn-h1">لون المساهمات</button><div class="qonan2000-content"><span class="close-btn-h1">×</span><div class="konan2000-content-color">
<div class="ko0nan2000" style="background: #2a013a;color: #ffffff;width: 100%;margin-bottom: 11px;">النص</div>
<div class="konan2000" data-color="#F44336"><div class="konan2000-content" style="background:#F44336"></div></div>
<div class="konan2000" data-color="#FF9800"><div class="konan2000-content" style="background:#FF9800"></div></div>
<div class="konan2000" data-color="#FFEB3B"><div class="konan2000-content" style="background:#FFEB3B"></div></div>
<div class="konan2000" data-color="#4CAF50"><div class="konan2000-content" style="background:#4CAF50"></div></div><br />
<div class="konan2000" data-color="#00BCD4"><div class="konan2000-content" style="background:#00BCD4"></div></div>
<div class="konan2000" data-color="#2196F3"><div class="konan2000-content" style="background:#2196F3"></div></div>
<div class="konan2000" data-color="#9C27B0"><div class="konan2000-content" style="background:#9C27B0"></div></div>
<div class="konan2000" data-color="#E91E63"><div class="konan2000-content" style="background:#E91E63"></div></div><br />
<div class="konan2000" data-color="#FFFFFF"><div class="konan2000-content" style="background:#FFFFFF"></div></div>
<div class="konan2000" data-color="#9E9E9E"><div class="konan2000-content" style="background:#9E9E9E"></div></div>
<div class="konan2000" data-color="#000000"><div class="konan2000-content" style="background:#000000"></div></div>
<div class="konan2000" data-color="#5D4037"><div class="konan2000-content" style="background:#5D4037"></div></div><br />
<div class="konan2000" data-color="#0000" style="background: #0000;border: solid 1px #0000;cursor: pointer;">لون شفاف</div><br />
<div class="konan2000" id="konan2000-Default">الألوان الافتراضية</div>
</div></div></div>
<!-- خلفية المساهمات -->
<div class="qonan2000">
<button class="qonan2000-btn-h1">خلفية المساهمات</button><div class="qonan2000-content"><span class="close-btn-h1">×</span><div class="conan2000-post-color">
<div class="ko0nan2000" style="background: #003e5c;color: #ffffff;width: 100%;margin-bottom: 11px;">الخلفية</div>
<div class="conan2000" data-color="#F44336"><div class="conan2000-post" style="background:#F44336"></div></div>
<div class="conan2000" data-color="#FF9800"><div class="conan2000-post" style="background:#FF9800"></div></div>
<div class="conan2000" data-color="#FFEB3B"><div class="conan2000-post" style="background:#FFEB3B"></div></div>
<div class="conan2000" data-color="#4CAF50"><div class="conan2000-post" style="background:#4CAF50"></div></div><br />
<div class="conan2000" data-color="#00BCD4"><div class="conan2000-post" style="background:#00BCD4"></div></div>
<div class="conan2000" data-color="#2196F3"><div class="conan2000-post" style="background:#2196F3"></div></div>
<div class="conan2000" data-color="#9C27B0"><div class="conan2000-post" style="background:#9C27B0"></div></div>
<div class="conan2000" data-color="#E91E63"><div class="conan2000-post" style="background:#E91E63"></div></div><br />
<div class="conan2000" data-color="#FFFFFF"><div class="conan2000-post" style="background:#FFFFFF"></div></div>
<div class="conan2000" data-color="#9E9E9E"><div class="conan2000-post" style="background:#9E9E9E"></div></div>
<div class="conan2000" data-color="#000000"><div class="conan2000-post" style="background:#000000"></div></div>
<div class="conan2000" data-color="#5D4037"><div class="conan2000-post" style="background:#5D4037"></div></div><br />
<div class="conan2000" data-color="#0000" style="background: #0000;border: solid 1px #0000;cursor: pointer;">لون شفاف</div><br />
<div class="conan2000" id="conan2000-Default">الألوان الافتراضية</div>
</div></div></div>
<!-- لون النص الاكواد-الاقتباس -->
<div class="qonan2000">
<button class="qonan2000-btn-h1">لون النص الاكواد-الاقتباس</button><div class="qonan2000-content"><span class="close-btn-h1">×</span><div class="konann2000-content-color">
<div class="ko0nann2000" style="background: #2a013a;color: #ffffff;width: 100%;margin-bottom: 11px;">النص</div>
<div class="konann2000" data-color="#F44336"><div class="konann2000-content" style="background:#F44336"></div></div>
<div class="konann2000" data-color="#FF9800"><div class="konann2000-content" style="background:#FF9800"></div></div>
<div class="konann2000" data-color="#FFEB3B"><div class="konann2000-content" style="background:#FFEB3B"></div></div>
<div class="konann2000" data-color="#4CAF50"><div class="konann2000-content" style="background:#4CAF50"></div></div><br />
<div class="konann2000" data-color="#00BCD4"><div class="konann2000-content" style="background:#00BCD4"></div></div>
<div class="konann2000" data-color="#2196F3"><div class="konann2000-content" style="background:#2196F3"></div></div>
<div class="konann2000" data-color="#9C27B0"><div class="konann2000-content" style="background:#9C27B0"></div></div>
<div class="konann2000" data-color="#E91E63"><div class="konann2000-content" style="background:#E91E63"></div></div><br />
<div class="konann2000" data-color="#FFFFFF"><div class="konann2000-content" style="background:#FFFFFF"></div></div>
<div class="konann2000" data-color="#9E9E9E"><div class="konann2000-content" style="background:#9E9E9E"></div></div>
<div class="konann2000" data-color="#000000"><div class="konann2000-content" style="background:#000000"></div></div>
<div class="konann2000" data-color="#5D4037"><div class="konann2000-content" style="background:#5D4037"></div></div><br />
<div class="konann2000" data-color="#0000" style="background: #0000;border: solid 1px #0000;cursor: pointer;">لون شفاف</div><br />
<div class="konann2000" id="konann2000-Default">الألوان الافتراضية</div>
</div></div></div>
<!-- خلفية الاكواد-الاقتباس -->
<div class="qonan2000">
<button class="qonan2000-btn-h1">خلفية الاكواد-الاقتباس</button><div class="qonan2000-content"><span class="close-btn-h1">×</span><div class="conan20000-post-color">
<div class="ko0nan2000" style="background: #003e5c;color: #ffffff;width: 100%;margin-bottom: 11px;">الخلفية</div>
<div class="conan20000" data-color="#F44336"><div class="conan20000-post" style="background:#F44336"></div></div>
<div class="conan20000" data-color="#FF9800"><div class="conan20000-post" style="background:#FF9800"></div></div>
<div class="conan20000" data-color="#FFEB3B"><div class="conan20000-post" style="background:#FFEB3B"></div></div>
<div class="conan20000" data-color="#4CAF50"><div class="conan20000-post" style="background:#4CAF50"></div></div><br />
<div class="conan20000" data-color="#00BCD4"><div class="conan20000-post" style="background:#00BCD4"></div></div>
<div class="conan20000" data-color="#2196F3"><div class="conan20000-post" style="background:#2196F3"></div></div>
<div class="conan20000" data-color="#9C27B0"><div class="conan20000-post" style="background:#9C27B0"></div></div>
<div class="conan20000" data-color="#E91E63"><div class="conan20000-post" style="background:#E91E63"></div></div><br />
<div class="conan20000" data-color="#FFFFFF"><div class="conan20000-post" style="background:#FFFFFF"></div></div>
<div class="conan20000" data-color="#9E9E9E"><div class="conan20000-post" style="background:#9E9E9E"></div></div>
<div class="conan20000" data-color="#000000"><div class="conan20000-post" style="background:#000000"></div></div>
<div class="conan20000" data-color="#5D4037"><div class="conan20000-post" style="background:#5D4037"></div></div><br />
<div class="conan20000" data-color="#0000" style="background: #0000;border: solid 1px #0000;cursor: pointer;">لون شفاف</div><br />
<div class="conan20000" id="conan20000-Default">الألوان الافتراضية</div>
</div></div></div>
</div>
<!-- BEGIN postrow -->
<!-- BEGIN hidden -->
<div class="post-wrap {postrow.hidden.ROW_CLASS} post-hidden">
<div class="block">
<div class="block-content">
<p style="text-align:center">{postrow.hidden.MESSAGE}</p>
<div class="block-footer" style="display: none;">
<!-- END hidden -->
<!-- BEGIN displayed -->
<div id="post-{postrow.U_POST_ID}" class="post-wrap {postrow.displayed.ROW_COUNT}{postrow.displayed.ONLINE_IMG_NEW} post--{postrow.displayed.U_POST_ID}">
<div id="{postrow.U_POST_ID}" class="post-header">
<h2>
<i class="material-icons">description</i>
{postrow.displayed.ICON}
<span class="post-heading-wrap">
<a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a>
<span class="post-date">{postrow.displayed.POST_DATE_NEW}</span>
</span>
</h2>
<div class="mobile-hide post-buttons">
<ul>
<li class="btn-thank">
{postrow.displayed.THANK_IMG}
</li>
<li class="btn-quote-multi">
{postrow.displayed.MULTIQUOTE_IMG}
</li>
<li class="btn-quote">
{postrow.displayed.QUOTE_IMG}
</li>
<li class="btn-edit">
{postrow.displayed.EDIT_IMG}
</li>
<li class="btn-delete">
{postrow.displayed.DELETE_IMG}
</li>
<li class="btn-ip">
{postrow.displayed.IP_IMG}
</li>
<li class="btn-report">
{postrow.displayed.REPORT_IMG_NEW}
</li>
</ul>
</div>
<div class="mobile-show dropdown post-buttons-mobile">
<i class="material-icons">more_horiz</i>
<ul class="dropdown-box">
<li class="btn-thank">
{postrow.displayed.THANK_IMG}
</li>
<li class="btn-quote-multi">
{postrow.displayed.MULTIQUOTE_IMG}
</li>
<li class="btn-quote">
{postrow.displayed.QUOTE_IMG}
</li>
<li class="btn-edit">
{postrow.displayed.EDIT_IMG}
</li>
<li class="btn-delete">
{postrow.displayed.DELETE_IMG}
</li>
<li class="btn-ip">
{postrow.displayed.IP_IMG}
</li>
<li class="btn-report">
{postrow.displayed.REPORT_IMG_NEW}
</li>
</ul>
</div>
</div>
<div class="post-body">
<div class="post">
<div class="post-content">
<div class="content">{postrow.displayed.MESSAGE}</div>
<!-- BEGIN switch_attachments -->
<div class="attachbox">
<b>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</b>
<dl class="attachments">
<!-- BEGIN switch_post_attachments -->
<dt>
<!-- BEGIN switch_dl_att -->
<a class="postlink btn btn-flat" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}"><i class="material-icons">attach_file</i>{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
<!-- END switch_dl_att -->
<!-- BEGIN switch_no_dl_att -->
<div class="postlink btn btn-flat" style="cursor: not-allowed"><i class="material-icons">attach_file</i>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT}</div> {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
<!-- END switch_no_dl_att -->
</dt>
<dd>
<!-- BEGIN switch_no_comment -->
<p>
{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}
</p>
<!-- END switch_no_comment -->
رد: مشكله في كود اعادة تحجيم الصور
النصف الثاني
- الكود:
<!-- BEGIN switch_no_dl_att -->
<p><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></p>
<!-- END switch_no_dl_att -->
<p>(<span class="ltr">{postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}</span>) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</p>
</dd>
<!-- END switch_post_attachments -->
</dl>
</div>
<!-- END switch_attachments -->
<!-- BEGIN switch_signature -->
<div class="post-signature" id="sig{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
<!-- END switch_signature -->
</div>
<div class="post-footer<!-- BEGIN switch_likes_active --> likes-active<!-- END switch_likes_active --><!-- BEGIN switch_vote_active --> vote-active<!-- END switch_vote_active -->">
<!-- BEGIN switch_likes_active -->
<div class="fa_like_div">
<button class="rep-button {postrow.displayed.switch_likes_active.C_VOTE_LIKE}" data-href="{postrow.displayed.switch_likes_active.U_VOTE_LIKE}" data-href-rm="{postrow.displayed.switch_likes_active.U_VOTE_RM_LIKE}">
<span class="rep-cat">
<i class="material-icons">thumb_up</i>
{postrow.displayed.switch_likes_active.COUNT_VOTE_LIKE}
</span>
<span>{postrow.displayed.switch_likes_active.L_LIKE}</span>
</button>
<!-- BEGIN switch_dislike_button -->
<button class="rep-button {postrow.displayed.switch_likes_active.switch_dislike_button.C_VOTE_DISLIKE}" data-href="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_DISLIKE}" data-href-rm="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_RM_LIKE}">
<span class="rep-cat">
<i class="material-icons">thumb_down</i>
{postrow.displayed.switch_likes_active.switch_dislike_button.COUNT_VOTE_DISLIKE}
</span>
<span>{postrow.displayed.switch_likes_active.switch_dislike_button.L_DISLIKE}</span>
</button>
<!-- END switch_dislike_button -->
<!-- BEGIN switch_like_list -->
{postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}
<!-- END switch_like_list -->
<!-- BEGIN switch_dislike_list -->
{postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}
<!-- END switch_dislike_list -->
</div>
<!-- END switch_likes_active -->
<!-- BEGIN switch_vote_active -->
<div class="vote">
<!-- BEGIN switch_vote -->
<a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="vote-up">
<i class="material-icons">add_circle_outline</i>
</a>
<!-- END switch_vote -->
<!-- BEGIN switch_vote -->
<a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="vote-down">
<i class="material-icons">remove_circle_outline</i>
</a>
<!-- END switch_vote -->
<!-- BEGIN switch_bar -->
<div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
<div class="vote-bar-desc">
{postrow.displayed.switch_vote_active.L_VOTE_TITLE}
</div>
<div class="vote-bars">
<!-- BEGIN switch_vote_plus -->
<div class="vote-bar-plus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-bar-minus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
<!-- END switch_vote_minus -->
</div>
</div>
<!-- END switch_bar -->
<!-- BEGIN switch_no_bar -->
<div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-bar-empty"></div>
<!-- END switch_no_bar -->
</div>
<!-- END switch_vote_active -->
</div>
</div>
<aside class="post-aside">
<div class="post-author-status"></div>
<div class="post-author">
<span class="post-author-name">
{postrow.displayed.POSTER_NAME}
</span>
<span class="post-author-title">
{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
</span>
</div>
<div class="post-author-avatar">
<div class="avatar-big">
{postrow.displayed.POSTER_AVATAR}
</div>
</div>
<dl class="post-author-details">
<!-- BEGIN profile_field -->
<dt>{postrow.displayed.profile_field.LABEL}</dt>
<dd>{postrow.displayed.profile_field.CONTENT}</dd>
<!-- END profile_field -->
</dl>
<div class="post-author-rpg">
{postrow.displayed.POSTER_RPG}
</div>
<div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">
<div class="ooكونان2000oo">الجوائز والأوسمة</div>
{postrow.displayed.AWARDS}
<br />
</div>
<div class="award_more"></div>
<br>
<div class="post-author-contact dropdown">
<i class="material-icons">keyboard_arrow_down</i>
<div class="dropdown-box">
{postrow.displayed.PROFILE_IMG}
{postrow.displayed.PM_IMG}
{postrow.displayed.EMAIL_IMG}
<!-- BEGIN contact_field -->
{postrow.displayed.contact_field.CONTENT}
<!-- END contact_field -->
</div>
</div>
</aside>
</div>
</div>
<!-- END displayed -->
<!-- BEGIN hidden -->
</div>
</div>
</div>
</div>
<!-- END hidden -->
<!-- END postrow -->
<!-- BEGIN promot_trafic -->
<div class="block block-ptrafic" id="ptrafic_close" style="display: none;">
<div class="block-header">
<a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');">
<i class="material-icons">add_circle</i>
</a>
<span>{PROMOT_TRAFIC_TITLE}</span>
</div>
</div>
<div class="block block-ptrafic" id="ptrafic_open" style="display:'';">
<div class="block-header">
<a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');">
<i class="material-icons">remove_circle</i>
</a>
<span>{PROMOT_TRAFIC_TITLE}</span>
</div>
<div class="block-content ptrafic">
<!-- BEGIN link -->
<a href="{promot_trafic.link.U_HREF}" title="{promot_trafic.link.TITLE}" >
<i class="material-icons">chat_bubble</i>
{promot_trafic.link.TITLE}
</a><br />
<!-- END link -->
</div>
</div>
<!-- END promot_trafic -->
<!-- BEGIN switch_forum_rules -->
<div class="block" id="forum_rules">
<div class="block-header">
{L_FORUM_RULES}
</div>
<div class="block-content">
<table class="postbody">
<tr>
<!-- BEGIN switch_forum_rule_image -->
<td class="logo">
<img src="{RULE_IMG_URL}" alt="" />
</td>
<!-- END switch_forum_rule_image -->
<td class="rules content">
{RULE_MSG}
</td>
</tr>
</table>
</div>
</div>
<!-- END switch_forum_rules -->
{INLINE_MESSAGE}
{QUICK_REPLY_FORM}
<script>
//<![CDATA[
(function() {
$(function() {
if ($.sceditor && !$('#quick_reply').length) {
$('#smiley-box,#smileyContainer').remove();
$.sceditor.command.set('scSmileys', {
dropDown: function(editor, caller) {
if ($('.sceditor-scSmileys').length) {
var smileysCont = $('.sceditor-scSmileys');
if (smileysCont.css('display') === 'none') {
editor.closeDropDown();
smileysCont.css('display', '');
$('.sceditor-scSmileys').css({
"margin-top": caller.outerHeight(),
"top": caller.offset().top,
"left": caller.offset().left
});
} else {
editor.closeDropDown();
smileysCont.css('display', 'none');
}
} else {
var content = $('<iframe id="quickEmojInternal" class="row1" name="smilies" width="220" scrolling="auto" height="250" frameborder="0" allowtransparency="true" src="/smilies?mode=smilies_frame" style="border: none;visibility: hidden">').load(function() {
$(this).css("visibility", "visible")
});
$('<div class="sceditor-dropdown sceditor-scSmileys" style="margin-top:' + caller.outerHeight() + 'px;top:' + caller.offset().top + 'px;left:' + caller.offset().left + 'px;">').append(content).appendTo($('body')).click(function(e) {
e.stopPropagation()
})
}
},
exec: function(caller) {
$.sceditor.command.get('scSmileys').dropDown(this, caller)
},
txtExec: function(caller) {
$.sceditor.command.get('scSmileys').dropDown(this, caller)
},
tooltip: 'الأبتسامات'
});
toolbar = toolbar.substr(0, toolbar.lastIndexOf("|")) + "|scSmileys" + toolbar.substr(toolbar.lastIndexOf("|"));
$(function() {
$(function() {
$('body,.sceditor-button:not(.sceditor-button-scSmileys)').click(function() {
if ($('.sceditor-scSmileys').css('display') !== 'none') $('.sceditor-scSmileys').css('display', 'none')
})
})
});
}
})
}()); //]]>
</script>
<link rel="stylesheet" href="https://illiweb.com/rs3/22/frm/SCEditor/src/themes/fa.rtl.default.min.css" type="text/css" media="all">
<style type="text/css">
.sceditor-button-flash div { background-position: 0 -628px; }
.sceditor-button-servimg div { background-position: 0 -644px; }
.sceditor-button-dailymotion div{ background-position: 0 -660px; }
.sceditor-button-faspoiler div { background-position: 0 -676px; }
.sceditor-button-fahide div { background-position: 0 -692px; }
.sceditor-button-fascroll div { background-position: 0 -708px; }
.sceditor-button-faupdown div { background-position: 0 -724px; }
.sceditor-button-farand div { background-position: 0 -756px; }
.sceditor-button-faroll div { background-position: 0 -772px; }
.sceditor-button-more div { background-position: 0 -788px; }
.sceditor-button-emoticon div { background-position: 0 -804px; }
.sceditor-button-headers div { background-position: 0 -820px; }
.sceditor-button-twemojifa div { background: url("https://2img.net/i/fa/icon_twemoji.png") !important; }
.sceditor-twemojifa{width:220px;height:250px;overflow-y:auto;}.sceditor-twemojifa img{cursor:pointer;padding:3px;}.sceditor-twemojifa img:hover{opacity:.7;}
.sceditor-button-mention div { background: url("https://2img.net/i//fa/icon_at.png") !important; }
#sceditor-mention-div { max-height: 200px; overflow: auto; }
.sceditor-mention-user { padding: 0 3px; border-radius: 3px; height: 25px; line-height: 25px; margin: 0 0 8px 0; background-color: #fbfbfb; border: 1px solid #f3f3f3; max-width: 300px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sceditor-mention-user img { height: 23px; margin: 0 4px; vertical-align: top; width: 23px; border-radius: 5px; background-color: #f5f5f5; border: 1px solid #ececec; overflow: hidden; object-fit:cover; }
.sceditor-mention-user:hover { background:#3793ff22;color: #000;cursor:pointer; }
.sceditor-button-giphy div { background-image: url("https://2img.net/i//fa/icon_gif.png") }
.quick-reply-textarea-wrap #quick-reply-avatar { right: 15px; top: 50px; z-index: 10; }
</style>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/jquery/cookie/jquery.cookie.js"></script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/jquery.sceditor.js"></script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/plugins/bbcode.js"></script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/sceditor-commands.js"></script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/sceditor-commands-bbcode.js"></script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/sceditor-custom-bbcode.js"></script>
<script type="text/javascript" charset="UTF-8">
(function ($) {
'use strict';
$.sceditor.locale["ar"] = {
"Bold" : "خط عريض",
"Italic" : "خط مائل",
"Underline" : "خط في الأسفل",
"Strikethrough" : "خط في المنتصف",
"Align left" : "انحياز الى اليسار",
"Center" : "توسيط",
"Align right" : "انحياز الى اليمين",
"Justify" : "ملأ السطر",
"Bullet list" : "قائمة نُقطية",
"Numbered list" : "قائمة رقمية",
"Insert a horizontal rule" : "إدراج سطر أُفقي",
"Insert a Quote" : "إدراج اقتباس",
"Code" : "إدراج أكواد برمجة",
"Spoiler" : "إخفاء الرد",
"Hidden" : "إخفاء مُقترن بالمساهمات",
"Insert a table" : "إدراج جدول",
"Host an image" : "رفع الصور",
"Insert an image" : "إدراج صورة",
"Insert a GIF" : "اختر ملف GIF",
"Insert an email" : "إضافة بريد الكتروني",
"Insert a link" : "إدراج رابط",
"Unlink" : "حذف الوصلة",
"Insert a YouTube video" : "إدراج رابط فيديو من موقع Youtube",
"Insert a Dailymotion Video" : "إدخال رابط فيديو من موقع Dailymotion",
"Flash" : "إدراج رابط ملف فلاشي",
"Format Headers" : "تنسيق العناوين",
"Font Size" : "حجم خط الكتابة",
"Font Color" : "لون خط الكتابة",
"Font Name" : "نوع خط الكتابة",
"Remove Formatting" : "إزالة تنسيق النص",
"Mention a user" : "وسم عضو",
"Subscript" : "حرف دليلي تحت السطر",
"Superscript" : "حرف دليلي فوق السطر",
"Horizontal scrolling" : "استعراض افقي",
"Vertical scrolling" : "استعراض عمودي",
"Random" : "عشوائي",
"Dices roll" : "رمي النرد (لعب الأدوار)",
"Insert an emoticon" : "الوجوه الضاحكة",
"Insert current date" : "تاريخ اليوم",
"Insert current time" : "التوقيت الحالي",
"Paste Text" : "إدراج نص بدون تنسيقه الأصلي",
"Switch Editor Mode" : "تغيير نمط نافذة الإرسال",
"color_dark_red" : "احمر قاتم",
"color_red" : "احمر",
"color_orange" : "برتقالي",
"color_brown" : "بني",
"color_yellow" : "اصفر",
"color_green" : "اخضر",
"color_olive" : "زيتوني",
"color_cyan" : "ازرق سماوي",
"color_blue" : "ازرق",
"color_dark_blue" : "ازرق قاتم",
"color_indigo" : "نيلي",
"color_violet" : "بنفسجي",
"color_grey" : "رمادي",
"color_white" : "ابيض",
"color_black" : "اسود",
"More" : "إظهار / إخفاء المزيد من الأزرار",
"Search" : "بحـث",
"Insert" : "إدراج",
"URL:" : "رابط",
"Invalid YouTube video" : "يوجد هناك خطئ في الفيديو",
"Author (optional)" : "الكاتب (حقل غير إجباري)",
"Title (optional)" : "العنوان (حقل غير إجباري)",
"Cols:" : "أعمدة",
"Rows:" : "خطوط",
"Width (optional):" : "عرض (حقل اختياري)",
"Height (optional):" : "ارتفاع (حقل اختياري)",
"Description (optional):" : "وصف (حقل اختياري)",
"Paste your text inside the following box:" : "قم بلصق النص المنسوخ أسفله لحذف تنسيقه الأصلي",
"Border" : "إطار",
"dateFormat": "month.day.year"
};
})(jQuery);
</script>
<script type="text/javascript">
var plugins = '';
var palette = 1;
var illiweb = 'https://illiweb.com/';
var locale = 'ar';
var height = '450';
var plugin = 'bbcode';
var toolbar = 'bold,italic,underline,strike|left,center,right,justify|bulletlist,orderedlist,horizontalrule|quote,code,faspoiler,fahide,table|servimg,image,link,youtube,dailymotion|headers,size,color,Font Color,font,removeformat|more|subscript,superscript|fascroll,faupdown,farand|mention,emoticon,twemojifa,date,time,pastetext,source';
var cssFile = 'https://illiweb.com/rs3/22/frm/SCEditor/minified/jquery.sceditor.default.min.css';
var isRtl = 1;
var dice = new Array();
var bSourceMode = true;
var quick_reply = '';
</script>
<script type="text/javascript" src="https://illiweb.com/rs3/22/frm/SCEditor/src/instance-sceditor.js"></script>
<div class="topic-actions bottom">
<div class="topic-actions-buttons">
<!-- BEGIN switch_user_logged_in -->
<!-- BEGIN watchtopic -->
{S_WATCH_TOPIC}
<!-- END watchtopic -->
<!-- END switch_user_logged_in -->
</div>
</div>
<!-- BEGIN switch_user_logged_out -->
<div id="logged_out_reply" class="content-block">
<h2 class="lor_maintitle">للمشاركة انت بحاجه الى تسجيل الدخول او التسجيل</h2>
<p class="lor_maindesc">يجب ان تعرف نفسك بتسجيل الدخول او بالاشتراك معنا للمشاركة</p>
<div class="lor_row">
<div class="lor_panel">
<h3 class="lor_subtitle">التسجيل</h3>
<p class="lor_subdesc">انضم الينا لن يستغرق منك الا ثوانى معدودة!</p>
<br/>
<a href="/register" class="button1">أنشئ حساب جديد</a>
</div>
<div class="lor_panel">
<h3 class="lor_subtitle">تسجيل الدخول</h3>
<p class="lor_subdesc">ليس لديك عضويه ؟ بضع ثوانى فقط لتسجيل حساب</p>
<br/>
<a href="/login" class="button1">تسجيل الدخول</a>
</div>
</div>
</div>
<!-- END switch_user_logged_out -->
<!-- BEGIN topicpagination -->
<div class="pagination">
{PAGINATION}
</div>
<!-- END topicpagination -->
{JUMPBOX}
<!-- BEGIN viewtopic_bottom -->
<form class="quickmod" method="get" action="{S_FORM_MOD_ACTION}">
<input type="hidden" name="t" value="{TOPIC_ID}" />
<!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
<input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />
<label>
<span>{L_MOD_TOOLS}:</span>
<div class="quickmod-wrap">
{S_SELECT_MOD}
<input type="submit" value="{L_GO}" />
</div>
</label>
</form>
<div class="topic-admin">{S_TOPIC_ADMIN}</div>
<!-- END viewtopic_bottom -->
<style>
.ooكونان2000oo {
background-color: #607d8b;
border-radius: 3px 3px 0 0;
color: #FFF;
text-align: center;
font-weight: 900;
width: 100%;
}
.dd_award {
max-height: 150px;
width: 100%;
}
.dd_award.left {
margin-top: 11px;
border: solid 1px #009688;
padding: 0;
background: white;
}
.dd_award + .award_more {
background: white;
width: 100%;
}
.post table, .post tr {
width: 100% !important;
border: none;
}
</style>
<style type="text/css">
a.sceditor-button.sceditor-button-maxi {
display: none;
}
.tborder {
background: #cccccc;
width: 100%;
/*border: 2px solid #666666;*/
}
.thead {
background: #efefef url(http://hitskin.com/themes/15/24/25/i_back_title.png) top left repeat-x;
color: #ffffff;
}
.thead a:link {
color: #ffffff;
text-decoration: none;
}
.thead a:visited {
color: #ffffff;
text-decoration: none;
}
.thead a:hover, .thead a:active {
color: #ffffff;
text-decoration: underline;
}
.trow1 {
background: #F5F5F5;
border-top: 2px solid #fff;
border-left: 2px solid #fff;
}
.trow2 {
background: #F6F6F6;
border-top: 2px solid #fff;
border-left: 2px solid #fff;
}
-->
</style>
<div class="ShareScreen">
<!-- social bookmarking links -->
<div class="IconShare">
<div class="fa fa-share-alt"></div>
</div>
<div class="ShareRight">العلامات المرجعية</div>
<div class="ShareList">
<ul style="list-style-type:none; margin:0px; padding:0px"><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="http://del.icio.us/post?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/S7M4Jrg.png" border="0" alt="إرسال الموضوع إلى del.icio.us" class="inlineimg" title="إرسال الموضوع إلى del.icio.us"></a>
<a rel="nofollow" href="http://del.icio.us/post?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">del.icio.us</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="http://digg.com/submit?phrase=2&url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/2qD8a8V.png" border="0" alt="إرسال الموضوع إلى Digg" class="inlineimg" title="إرسال الموضوع إلى Digg"></a>
<a rel="nofollow" href="http://digg.com/submit?phrase=2&url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Digg</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="http://www.stumbleupon.com/submit?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/8mPotnI.png" border="0" alt="إرسال الموضوع إلى StumbleUpon" class="inlineimg" title="إرسال الموضوع إلى StumbleUpon"></a>
<a rel="nofollow" href="http://www.stumbleupon.com/submit?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">StumbleUpon</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/Ft7i5Aa.png" border="0" alt="إرسال الموضوع إلى Google" class="inlineimg" title="إرسال الموضوع إلى Google"></a>
<a rel="nofollow" href="http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Google</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="https://twitter.com/home?status=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/FUQJCZV.png" border="0" alt="إرسال الموضوع إلى Twitter" class="inlineimg" title="إرسال الموضوع إلى Twitter"></a>
<a rel="nofollow" href="https://twitter.com/home?status=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Twitter</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="https://www.facebook.com/sharer.php?u=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/HgQHKD6.png" border="0" alt="إرسال الموضوع إلى Facebook" class="inlineimg" title="إرسال الموضوع إلى Facebook"></a>
<a rel="nofollow" href="https://www.facebook.com/sharer.php?u=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Facebook</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a rel="nofollow" href="https://www.reddit.com/submit?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/SF9SSZd.png" border="0" alt="إرسال الموضوع إلى Reddit" class="inlineimg" title="إرسال الموضوع إلى Reddit"></a>
<a rel="nofollow" href="https://www.reddit.com/submit?url=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Reddit</a>
</li><li class="smallfont" style="width:25%; min-width:160px; float:right; margin-top:6px">
<a href="http://technorati.com/faves?add=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark"><img src="https://i.imgur.com/hSLLzs3.png" border="0" alt="إرسال الموضوع إلى Technorati" class="inlineimg" title="إرسال الموضوع إلى Technorati"></a>
<a href="http://technorati.com/faves?add=https://syria.forummo.com/topic-t{TOPIC_ID}.htm" target="socialbookmark" style="text-decoration:none">Technorati</a>
</li>
</ul></div></div>
<!-- social bookmarking links -->
<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.postbody .content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->
<!-- BEGIN show_permissions -->
<div class="block">
<div class="block-header">
<i class="material-icons">privacy_tip</i> {L_TABS_PERMISSIONS}
</div>
<div class="block-content">
{S_AUTH_LIST}
</div>
</div>
<!-- END show_permissions -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}" rel="nofollow" {S_POST_REPLY_TOPIC} class="btn-fixed" title="{L_POST_REPLY_TOPIC}">
<i class="material-icons">{I_POST_REPLY_TOPIC}</i>
<span class="btn-fixed-txt">{L_POST_REPLY_TOPIC}</span>
</a>
<!-- END switch_user_authreply -->
</main>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$('.post-author-contact').each(function () {
$(this).find('a:nth-child(5n)').each(function () {
$(this).after('<br />');
});
});
});
//]]>
</script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/railscasts.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
$('pre, code').each(function(i, block) {
hljs.highlightBlock(block);
});
$('.post-author-contact').on('click', function() {
if ($(this).parents('.post-body').css('flex-direction') == 'row') {
$(this).children('.dropdown-box').css({
'left': 'auto',
'right': '0'
});
} else {
$(this).children('.dropdown-box').css({
'left': '0',
'right': 'auto'
});
}
});
});
</script>
رد: مشكله في كود اعادة تحجيم الصور
اهلا جرب الجافا التالي مكان السابق
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
رد: مشكله في كود اعادة تحجيم الصور
الكتابة اصبحت مظبوطة لكن مازال لايظهر فوق الصور بشكل صحيحكونان2000 كتب:اهلا جرب الجافا التالي مكان السابق
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { font-size:12px; text-align:left; padding:3px; margin:3px 0; background:#FFF; border:1px solid #CCC; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
ملاحظة هذا كود ايموجي صورة العضو الذي قمت بتعديله منذ قليل قد تكون المشكله ان الكود لاينتهي بصيغة صورة ؟ كPNG والخ؟ لكن كيف كود التصغير والتكبير يعمل ويظهر عند وجودها ولكن لايتم جعلها فوق الصورة ؟
رد: مشكله في كود اعادة تحجيم الصور
اهلا جرب التالي مكان السابق
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { style="display: flex;font-size: 16px;line-height: normal;flex-direction: column;align-items: center; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
المبدع الخبير يعجبه هذا الموضوع
رد: مشكله في كود اعادة تحجيم الصور
مازال لايظهر اعلى الصوركونان2000 كتب:اهلا جرب التالي مكان السابق
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { style="display: flex;font-size: 16px;line-height: normal;flex-direction: column;align-items: center; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
وايضا لاحظت انه عندما اضغط تكبير الصورة الكود يرجع يخرب الكتابه فيه
ملاحظة اخرى الآن في الكود الاخير حتى الخلفية البيضاء التي تظهر فيها تكبير وتصغير الصورة اختفت !
رد: مشكله في كود اعادة تحجيم الصور
لاحظت ان تكبير وتصغير الصورة تصبح في المنتصف اذا قمت بوضع كود
اثناء انشاء الموضوع او الرد
- الكود:
[center][/center]
اثناء انشاء الموضوع او الرد
رد: مشكله في كود اعادة تحجيم الصور
قد تكون المشكله في css انها توسط الكتابات والصور في المواضيع فقط ولاتقوم بتوسيط كود تحجيم الصور
رد: مشكله في كود اعادة تحجيم الصور
هذا كود توسيط المساهمات الذي استخدمه قد تكون المشكله فيه
- الكود:
.content{
text-align: center;
}
المبدع الخبير يعجبه هذا الموضوع
رد: مشكله في كود اعادة تحجيم الصور
نعم هذا بسبب توسيط المساهمات من الcss
جرب التالي
جرب التالي
- الكود:
.fa_img_resizer {
width: auto !important;
}
المبدع الخبير يعجبه هذا الموضوع
رد: مشكله في كود اعادة تحجيم الصور
اضف التالي الى الcss
- الكود:
.fa_img_resizer {
text-align: center !important;
}
المبدع الخبير يعجبه هذا الموضوع
رد: مشكله في كود اعادة تحجيم الصور
تم الحل لكن لماذا الكود يظهر في الصور الصغيرة ولايقوم بتكبيرها ولاتصغيرها ؟
انظر هنا اخي كونان
هل يمكنك جعل الكود يكبر الصور الصغيرة ويصغر الصور الكبيرة؟
انظر هنا اخي كونان
هل يمكنك جعل الكود يكبر الصور الصغيرة ويصغر الصور الكبيرة؟
رد: مشكله في كود اعادة تحجيم الصور
اهلا
جرب الجفا التالي
جرب الجفا التالي
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { style="display: flex;font-size: 16px;line-height: normal;flex-direction: column;align-items: center; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100% !important; max-width:100% !important; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
رد: مشكله في كود اعادة تحجيم الصور
لم يتغير شيء بالعكس اختفت الخلفية البيضاء التي تظهر خلف تكبير والعرض بحجم كامل وتحميل الصورةكونان2000 كتب:اهلا
جرب الجفا التالي
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc && (a[i].naturalWidth > fa_img_resizer.max_width || a[i].naturalHeight > fa_img_resizer.max_height)) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="/viewimage.forum?u=' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { style="display: flex;font-size: 16px;line-height: normal;flex-direction: column;align-items: center; }'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100% !important; max-width:100% !important; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
رد: مشكله في كود اعادة تحجيم الصور
قبل التعديل الجافا
عندك كود مثل التالي في الcss
لازم تغيره للتالي
عندك كود مثل التالي في الcss
- الكود:
.emotiuser_icon {
width: 45px !important;
height: 45px !important;
vertical-align: middle;
margin: 3px;
}
لازم تغيره للتالي
- الكود:
.emotiuser_icon {
width: 45px;
height: 45px;
vertical-align: middle;
margin: 3px;
}
رد: مشكله في كود اعادة تحجيم الصور
قمت بفعل ذلك ومازال لايعمل وكما قلت الخلفية البيضاء الخاصة بتكبير الصورة وتصغيرها اختفت اصلا في اخر كود قمت بارساله ومازالت مشكلة حجم الصور في نسخة الهاتفكونان2000 كتب:قبل التعديل الجافا
عندك كود مثل التالي في الcss
- الكود:
.emotiuser_icon {
width: 45px !important;
height: 45px !important;
vertical-align: middle;
margin: 3px;
}
لازم تغيره للتالي
- الكود:
.emotiuser_icon {
width: 45px;
height: 45px;
vertical-align: middle;
margin: 3px;
}
رد: مشكله في كود اعادة تحجيم الصور
جرب الجافا مكان السابق
- الكود:
(function() {
window.fa_img_resizer = {
max_width: 400, // maximum image width (400px)
max_height: 250, // maximum image height (250px)
selector: '.post-content > div:not(.user):not(.postprofile):not(.post-signature) img, .mod_news img, .message-text img, img[src*="https://"]', // where images should be resized
options: {
bar: true, // resized image options bar
toggler: true, // Enlarge / Reduce Image
full_size: true, // Show full size
download: true, // Download image link
lightbox: true // lightbox effect
},
// texts
lang: {
full_size: '<i class="fa fa-external-link"></i> العرض بحجم كامل',
enlarge: '<i class="fa fa-search-plus"></i> تكبير الصورة',
reduce: '<i class="fa fa-search-minus"></i> تصغير الصورة',
download: '<i class="fa fa-download"></i> تحميل الصورة',
tooltip: 'إضغط للعرض بالحجم الكامل'
},
// resize all images inside the "resizeIn" elements
resize: function() {
for (var a = $(fa_img_resizer.selector).not('.mention-ava'), i = 0, j = a.length; i < j; i++) {
if (!a[i].longdesc) {
const imgWidth = a[i].naturalWidth || a[i].width;
const imgHeight = a[i].naturalHeight || a[i].height;
if (imgWidth > fa_img_resizer.max_width || imgHeight > fa_img_resizer.max_height) {
a[i].className += ' fa_img_reduced';
// make the image a "link" if it's not wrapped with one
if (fa_img_resizer.options.lightbox && a[i].parentNode.tagName != 'A') {
a[i].style.cursor = 'pointer';
a[i].title = fa_img_resizer.lang.tooltip;
a[i].onclick = function() {
fa_img_resizer.lightbox(this);
};
}
// create the resize bar
if (fa_img_resizer.options.bar) {
const resizerDiv = document.createElement('div'); // إنشاء عنصر جديد
resizerDiv.className = 'fa_img_resizer';
resizerDiv.style.width = fa_img_resizer.max_width + 'px'; // تطبيق العرض الأقصى على شريط الخيارات
resizerDiv.innerHTML =
(fa_img_resizer.options.toggler ? '<a class="fa_img_enlarge" href="#" onclick="fa_img_resizer.toggle(this); return false;">' + fa_img_resizer.lang.enlarge + '</a>' : '') +
(fa_img_resizer.options.full_size ? '<a class="fa_img_full" href="' + a[i].src + '" target="_blank">' + fa_img_resizer.lang.full_size + '</a>' : '') +
(fa_img_resizer.options.download && !/Firefox/.test(navigator.userAgent) && 'download' in document.createElement('A') ? '<a class="fa_img_download" href="' + a[i].src + '" target="_blank" download>' + fa_img_resizer.lang.download + '</a>' : '');
(a[i].parentNode.tagName == 'A' ? a[i].parentNode : a[i]).insertAdjacentElement('beforebegin', resizerDiv);
}
}
}
}
},
// toggle between enlarged and reduced image sizes
toggle: function(that) {
var img = that.parentNode.nextSibling;
if (img.tagName == 'A') {
img = img.getElementsByTagName('IMG')[0];
}
if (/fa_img_reduced/.test(img.className)) {
that.innerHTML = fa_img_resizer.lang.reduce;
that.className = 'fa_img_reduce';
img.className = img.className.replace(/fa_img_reduced/, 'fa_img_enlarged');
} else {
that.innerHTML = fa_img_resizer.lang.enlarge;
that.className = 'fa_img_enlarge';
img.className = img.className.replace(/fa_img_enlarged/, 'fa_img_reduced');
}
that.parentNode.style.width = img.width - 8 + 'px';
},
// lightbox effect
lightbox: function(that) {
var frag = document.createDocumentFragment(),
overlay = $('<div id="fa_img_lb_overlay" />')[0],
img = $('<img id="fa_img_lb_image" src="' + that.src + '" />')[0];
overlay.onclick = fa_img_resizer.kill_lightbox;
img.onclick = fa_img_resizer.kill_lightbox;
frag.appendChild(overlay);
frag.appendChild(img);
document.body.appendChild(frag);
document.body.style.overflow = 'hidden';
img.style.marginTop = '-' + (img.height / 2) + 'px';
img.style.marginLeft = '-' + (img.width / 2) + 'px';
},
// kill the lightbox
kill_lightbox: function() {
var overlay = document.getElementById('fa_img_lb_overlay'),
img = document.getElementById('fa_img_lb_image');
overlay && document.body.removeChild(overlay);
img && document.body.removeChild(img);
document.body.style.overflow = '';
}
};
// write styles into the document head
document.write(
'<style type="text/css">'+
fa_img_resizer.selector + ', .fa_img_reduced { max-width:' + fa_img_resizer.max_width + 'px; max-height:' + fa_img_resizer.max_height + 'px; }'+
'.fa_img_enlarged,.emotiuser_icon { max-width:100% !important; max-height:100% !important; }'+
'.fa_img_resizer { width: fit-content !important;border: solid 1px #bbbbbb; background: #dddddd;font-size: 16px;line-height: normal;}'+
'.fa_img_resizer a { margin:0 3px; }'+
'.fa_img_resizer i { font-size:14px; vertical-align:middle; }'+
'#fa_img_lb_overlay { background:rgba(0, 0, 0, 0.7); position:fixed; top:0; right:0; bottom:0; left:0; z-index:999999; cursor:pointer; }'+
'#fa_img_lb_image { max-height:100%; max-width:100%; position:fixed; left:50%; top:50%; z-index:9999999; cursor:pointer; }'+
'</style>'+
(!$('link[href$="font-awesome.min.css"]')[0] ? '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" />' : '') // require font awesome
);
// begin modifying images when the page is loaded
$(window).load(fa_img_resizer.resize);
// kill forumactif's image resizer
if (window.resize_images) {
window.resize_images = function() {
return false;
};
}
}());
صفحة 1 من اصل 2 • 1, 2
مواضيع مماثلة
» ارجو المساعده فى اعادة عمل كود رفع الصور الخاص بالمنتى
» اريد تحجيم الصورة بنفس الصفحة المعاينة بها
» لدي مشكله في حذف الصور
» مشكله في الصور
» مشكله رفع الصور
» اريد تحجيم الصورة بنفس الصفحة المعاينة بها
» لدي مشكله في حذف الصور
» مشكله في الصور
» مشكله رفع الصور
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: دعم مشاكل التومبلايت و الأكواد :: أرشيف قسم "مشاكل التومبلايت و الأكواد"
صفحة 1 من اصل 2
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى