شريط اخر الاخبار احترافي
شريط اخر المواضيع للنسخه الاخيرة AwesomeBB ولجميع النسخ و شريط اخر الاخبار لقسم معين
ها انا اليوم أتيكم بكود شريط اخر الاخبار لقسم معين لعيونكم
مميزات الكود
امكانية جلب آخر مواضيع لقسم معين اتوماتيك
اذا تركت رقم القسم فارغ فإن الكود سيعرض آخر مواضيع المنتدي
امكانيةتحديد عدد معين للمواضيع في شريط الاخبار
امكانية التحكم الكامل في شريط الاخبار من خلال الكود
الكود يدعم نسخه الجوال
الكود سريع وخفيف علي التصميم
هناك المزيد من المزايا اكتشفها بنفسك ...
طريقة تركيب الكود:
انسخ الكود التالي و ضعه في الإعلانات الخاصة او بداية قالب ال index_body او نهاية قالب overall_header
- الكود:
-
<div class="newsLocation"></div>
ثم اذهب الي
لوحة الادارة - عناصر اضافية -- إدارة أكواد Javascript
إنشاء كود جديد
العنوان * : شريط اخر الاخبار
أضف الكود الى : جميع الصفحات
- الكود:
-
$(function getNews() {
var lastNewsTitle = 'آخر الأخبار',
forumNumper = '1', // رقم القسم
numberOfNews = '10', // عدد المواضيع
speedOfNews = '60', // سرعة التتالي
separateImg = 'https://i.servimg.com/u/f51/19/34/86/41/best-d10.png', // الصورة الفاصلة بين كل موضوع
newsTitleBg = '#369FCF', // لون خلفية نص آخر الأخبار
newsBg = '#FFF', // لون خلفية شريط آخر الأخبار
newsLocation = '.newsLocation',
lastNewsContainer = document.createElement("DIV");
lastNewsContainer.className = "lastNewsContainer";
lastNewsContainer.innerHTML =
'<div class="lastNewsTitle">' + lastNewsTitle + '</div><div class="lastNewsItems-wrap"><div class="lastNewsItems marquee"></div></div>';
if (newsLocation) {
document.querySelector(newsLocation).appendChild(lastNewsContainer);
}
function loadDoc(f, c) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var parser = new DOMParser(),
newsResult = parser.parseFromString(this.responseText, "text/xml");
for (i = 0; i < c; i++) {
var lastNewsBlock = document.createElement('SPAN');
lastNewsBlock.className = 'lastNewsBlock';
lastNewsBlock.innerHTML = '<a href="' + newsResult.querySelectorAll('item')[i].querySelector('link').innerHTML + '" class="lastNews">' + newsResult.querySelectorAll('item')[i].querySelector('title').innerHTML + '</a><img src="' + separateImg + '" class="separateImg" alt="" />';
document.querySelector('.lastNewsItems').append(lastNewsBlock);
}
}
};
xhttp.open("GET", "/feed?f=" + f, true);
xhttp.send();
}
loadDoc(forumNumper, numberOfNews);
var newsStyle = document.createElement('STYLE');
newsStyle.innerHTML = '.marquee { display: inline-block; padding-right: 100%; white-space: nowrap; animation: marquee ' + speedOfNews + 's linear infinite; }.separateImg, .lastNews { display: inline-block; vertical-align: middle; } .separateImg { margin: 0 40px; max-width: 30px; max-height: 30px; } .lastNewsBlock:last-child .separateImg { display: none; } .lastNewsItems-wrap:hover .marquee { animation-play-state: paused } @keyframes marquee { 0% { transform: translate(0, 0); } 100% { transform: translate(100%, 0); } } .lastNewsContainer { display: inline-flex; width: 100%; align-items: center; background: ' + newsTitleBg + '; color: #FFF; margin: 20px 0; box-sizing: border-box; } .lastNewsTitle { min-width: 100px; text-align: center; } .lastNewsItems-wrap { width: 100%; background: ' + newsBg + '; border: 1px solid ' + newsTitleBg + '; overflow: hidden; }';
document.head.appendChild(newsStyle);
});
//by omarpop23
التعديلات:
يمكنك فقط تعديل اللغه و النصوص من هنا
- الكود:
-
var lastNewsTitle = 'آخر الأخبار',
forumNumper = '1', // رقم القسم
numberOfNews = '3', // عدد المواضيع
speedOfNews = '30', // سرعة التتالي
separateImg = 'https://i.servimg.com/u/f51/19/34/86/41/best-d10.png', // الصورة الفاصلة بين كل موضوع
newsTitleBg = '#369FCF', // لون خلفية نص آخر الأخبار
newsBg = '#FFF', //
ملحوظه: الكود يعمل علي جميع النسخ
تحياتي لكـــم
الكود من برمجة omarpop23
ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ