المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : كود فعاليات المنتدى بعرض مميز مع Jquery


مدهش
2011-09-10, 11:21 PM
التركيب :

اولا نقوم برفع مابداخل مجلد vb في المرفق الى مجلد منتداك

مع تغيير الصور في مجلد image دون تغيير اسمها فقط غير الصور وضعها بنفس الاسم

مثلا في صورة باسم landscapes الصور اللي تبي تحطها حطها بهذا الاسم والامر ينطبق ع باقي الصور

بعد الانتهاء من الرفع الى مجلد منتداك

اضف الكود التالي الى الاستايل في خيارات css الاضافيه

لوحة التحكم > التحكم بالاستايلات > الاستايل الذي تستخدمه اختار css رئيسي

وضع الكود في تعاريف CSS الإضافية/Additional CSS Definitions

http://cdn5.tribalfusion.com/media/37536.gif


الصندوق الثاني .



رمز Code:.jimgMenu { position:relative; margin: 0px 0px 0px 50px; padding: 0px; width:475px; height:200px; overflow: hidden; } .jimgMenu ul { list-style: none; margin: 0px; padding: 0px; display: block; height: 200px; position: relative; } .jimgMenu ul li { width: 95px; float: left; display: block; overflow: hidden; } .jimgMenu ul li a { text-indent: -1000px; background:#fff repeat scroll 0%; border-right: 2px solid #fff; cursor:pointer; display:block; overflow: hidden; height: 200px; } .jimgMenu ul li#landscapes a { background: url(images/landscapes.jpg) repeat scroll 0%; } .jimgMenu ul li#people a { background: url(images/people.jpg) repeat scroll 0%; } .jimgMenu ul li#nature a { background: url(images/nature.jpg) repeat scroll 0%; } .jimgMenu ul li#abstract a { background: url(images/abstract.jpg) repeat scroll 0%; } .jimgMenu ul li#urban a { background: url(images/urban.jpg) repeat scroll 0%; border-right-style: none; } ثم ضع الكود التالي اسفل الهيدر


رمز Code: <center><div class="jimgMenu"> <ul> <li id="landscapes"><a href="http://www.forum.fwasl.com/showthread.php?t=7972">Landscapes</a></li> <li id="people"><a href="http://www.forum.fwasl.com /showthread.php?t=7972">People</a></li> <li id="nature"><a href="http://www.forum.fwasl.com /showthread.php?t=7972">Nature</a></li> <li id="abstract"><a href="http://www.forum.fwasl.com /showthread.php?t=7972">Abstract</a></li> <li id="urban"><a href="http://www.forum.fwasl.com /showthread.php?t=7972">Urban</a></li> </ul> </div></center> <link href="css/jimgMenukwicks.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script> <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script> <script type="text/javascript" src="js/jquery.kwicks-1.5.1.pack.js"></script> <script type="text/javascript"> $().ready(function() { $('.jimgMenu ul').kwicks({max: 310, duration: 300, easing: 'easeOutQuad', complete: 'callback'}); }); </script>


لا ننسى تعديل الروابط اللي باللون الاحمر بروابط المواضيع في منتداكم