السلام عليكم .
طابت أوقاتكم .
إليكم طريقة جديدة للأخبار الهامة .
صورة للطريقة .
عند مرور الماوس على الصورة سيظهر الخبر .
ملاحظة : الشرح المصور (
هنا )
الطريقة كالآتي :-
رفع الملفين التاليين إلى مجلد الصور في الاستايل الذي ستعمل عليه التعديل .
impnewscss.css
impnewsjs.js
ثانياً : تحذف قالب الأخبار الهامة في الإستايل المطلوب .
في الإفتراضي موجود في index.htm
وهذا القالب الذي تم حذفه .
كود:
<!-- START BLOCK : importantnews -->
<script type="text/javascript">
$(function() {
$(".importantnews").jCarouselLite({
vertical: true,
hoverPause:true,
visible: 3,
auto:3000,
speed:500,
btnNext: ".nextimp",
btnPrev: ".previmp",
circular: true,
mouseWheel: true
});
});
</script>
<td valign="top" width="40%">
<div class="module-title">{phrase_important_news}</div>
<div id="contents">
<div id="importantnews">
<div class="importantnews">
<ul>
<!-- START BLOCK : impnews -->
<li>
<div class="largfont">
<span style='float:{lang_left};margin-{lang_right}:2px;padding-top:0px'>{picture}</span>
<b>{caption}</b>
</div>
</li>
<!-- END BLOCK : impnews -->
</ul>
</div>
<div align="center">
<input type="image" src="{img_dir}/buttons/up.png" class="previmp" title="{phrase_prev}" />
<input type="image" src="{img_dir}/buttons/down.png" class="nextimp" title="{phrase_next}" />
</div>
</div>
</div>
</td>
<!-- END BLOCK : importantnews -->
بعد الحذف اضغط تحرير .
ثم أذهب إلى قالب ccontent.htm
أضف الكود التالي في أعلاه .
كود:
<!-- START BLOCK : importantnews -->
<link rel="stylesheet" type="text/css" href="{img_dir}/impnewscss.css" />
<script type="text/javascript" src="{img_dir}/impnewsjs.js"></script>
<script type="text/javascript">
haccordion.setup({
accordionid: 'hc1', //main accordion div id
paneldimensions: {peekw:'50px', fullw:'410px', h:'90px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //<- No comma following very last setting!
})
</script>
<div class="module-title">{phrase_important_news}</div>
<div class="whitecontent">
<div id="hc1" class="haccordion"><ul>
<!-- START BLOCK : impnews -->
<li>
<div class="hpanel"><img src="contents/newsm/{id}.{ext}" style="float:right; width:100px; height:80px" /><p class="largfont" style="padding-right:3px;"><b>{caption}</b></p></div>
</li>
<!-- END BLOCK : impnews -->
</ul></div></div>
<br/>
<!-- END BLOCK : importantnews -->
ثم أضغط تحرير .
أطيب تحية .