السلام عليكم اخواني
ا
خر المواضيع بتقنية [jQUery]
لرؤية مثال
مـــن هــنـــا
طريقة التركيب install
افتح تملت
headinclude
و بآخر التملت بالاخيررر ضع هاذا الكود code
رمز Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script src="js/jquery.ticker.js" type="text/javascript"></script> <script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script> <script type="text/javascript"> $(function () { $('#js-news').ticker(); }); </script>
و افتح تملت
additional.css
وضع هاذا الكود code باخره
رمز Code:
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ اخر المواضيع بالمنتدى forum منتديات برامج العرب ~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #ticker-wrapper * { margin-left: auto; margin-right: auto; } #ticker-wrapper.has-js { margin: 20px auto 20px auto; padding: 0px 20px; width: 900px; height: 30px; display: block; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background-color: #f8f0db; font-size: 1.1em; } #ticker { width: 830px; height: 30px; display: block; position: relative; overflow: hidden; background-color: #f8f0db; } #ticker-title { padding: 5px; color: #990000; font-weight: bold; background-color: #f8f0db; text-transform: none; } #ticker-content { margin: 0px; padding: 5px; position: absolute; color: #1F527B; font-weight: normal; background-color: #f8f0db; overflow: hidden; white-space: nowrap; line-height: 1.2em; } #ticker-content:focus { none; } #ticker-content a { text-decoration: none; color: #1F527B; } #ticker-content a:hover { text-decoration: underline; color: #0D3059; } #ticker-swipe { padding-top: 9px; position: absolute; top: 0px; background-color: #f8f0db; display: block; width: 800px; height: 23px; } #ticker-swipe span { margin-left: 1px; background-color: #f8f0db; border-bottom: 1px solid #1F527B; height: 12px; width: 7px; display: block; } #ticker-controls { padding: 8px 0px 0px 0px; list-style-type: none; float: left; } #ticker-controls li { padding: 0px; margin-left: 5px; float: left; cursor: pointer; height: 16px; width: 16px; display: block; } #ticker-controls li#play-pause { background-image: url('../images/controls.png'); background-position: 32px 16px; } #ticker-controls li#play-pause.over { background-position: 32px 32px; } #ticker-controls li#play-pause.down { background-position: 32px 0px; } #ticker-controls li#play-pause.paused { background-image: url('../images/controls.png'); background-position: 48px 16px; } #ticker-controls li#play-pause.paused.over { background-position: 48px 32px; } #ticker-controls li#play-pause.paused.down { background-position: 48px 0px; } #ticker-controls li#prev { background-image: url('../images/controls.png'); background-position: 0px 16px; } #ticker-controls li#prev.over { background-position: 0px 32px; } #ticker-controls li#prev.down { background-position: 0px 0px; } #ticker-controls li#next { background-image: url('../images/controls.png'); background-position: 16px 16px; } #ticker-controls li#next.over { background-position: 16px 32px; } #ticker-controls li#next.down { background-position: 16px 0px; } .js-hidden { display: none; } #no-js-news { padding: 10px 0px 0px 45px; color: #F8F0DB; } .left #ticker-swipe { left: 80px; } .left #ticker-controls, .left #ticker-content, .left #ticker-title, .left #ticker { float: left; } .left #ticker-controls { padding-left: 6px; } .right #ticker-swipe { right: 80px; } .right #ticker-controls, .right #ticker-content, .right #ticker-title, .right #ticker { float: right; } .right #ticker-controls { padding-right: 6px; }
و بالاخير افتح تملت
navbar
وضع هاذا الكود code بالاخير
رمز Code:
<!--ticker--> <div id="ticker-wrapper" class="no-js"> <ul id="js-news" class="js-hidden"> <script type="text/javascript" src="{vb:raw vboptions.bburl}/external.php?&type=js"></script> <script type="text/javascript"> <!-- for (var i = 0; i < threads.length; i++) { document.write('<li><a href="{vb:raw vboptions.bburl}/showthread.php?t=' + threads[i]['threadid'] + '">' + threads[i]['title'] + '</a>' + ' ' + '<span style="color: red;">بواسطة:</span>'+ ' ' + threads[i]['poster'] + '</a>' + '</li>'); } //--> </script> </ul> </div> <!--ticker-->
و ارفع الملف المرفق