الويب العربي - طريقة جديدة للأخبار الهامة .

السلام عليكم .

طابت أوقاتكم .

إليكم طريقة جديدة للأخبار الهامة .

صورة للطريقة .

عند مرور الماوس على الصورة سيظهر الخبر .

ملاحظة : الشرح المصور ( هنا )

الطريقة كالآتي :-

رفع الملفين التاليين إلى مجلد الصور في الاستايل الذي ستعمل عليه التعديل .

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 -->

ثم أضغط تحرير .

أطيب تحية .