منتديات هرقلة ستار




أهلا وسهلا بك زائرنا الكريم في منتديات هرقلة ستار، لكي تتمكن من المشاركة ومشاهدة جميع أقسام المنتدى وكافة الميزات ، يجب عليك إنشاء حساب جديد بالتسجيل بالضغط هنا أو تسجيل الدخول اضغط هنا إذا كنت عضواً .




اضافة رد جديد اضافة موضوع جديد


23-10-2023 17:24

معلومات الكاتب ▼
إنضم في : 24-03-2022
رقم العضوية : 1
المشاركات : 624
قوة السمعة : 100
بسم الله الرحمان الرحيم

في هذا الشرح سنتطرق لكيفية إضافة

لروابط المواضيع في رئيسية كما هو مبين بالصور ة التالية

<figure class="image">شرح عمل tooltip في المنتدى</figure>

شرح التنصيب

نقوم بإضافة الكلاس التالي في ملف ستايل المنتدى

.tooltip {
position: relative;
color: #00b4ab;
opacity: 1;
visibility: visible;
z-index: 1;
}

.tooltip .tooltip-text {
font-family: "Open Sans", sans-serif;
font-size: 1em;
line-height: 1.5em;
visibility: hidden;
max-width: 300px;
background-color: #00b4ab;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 10px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -60px;
opacity: 0;
transition: .3s;
transform: translate3d(0px, 20px, 0px);

}

.tooltip .tooltip-text::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #00b4ab transparent transparent transparent;

}

.tooltip:hover .tooltip-text {
visibility: visible;
opacity: 1;
transform: translate3d(0px, 0px, 0px);
}
.linktooltip{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
color:#00b4ab;
font-weight:900;

}
.linktooltip:hover{

color:#00b4ab;


}</pre>[p]

في قالب sections_list نستبدل الكود التالي

</pre>[p]

بالكود التالي

{$forum['last_subject_title']} </pre>[p]

نقوم بعد ذلك بتفريغ كاش المتصفح ونلاحظ النتيجة







اضافة رد جديد اضافة موضوع جديد




الكلمات الدلالية
tooltip ، المنتدى ،