السلام عليكم..
يوجد في ياهو تابز رائعة جدا http://www.yahoo.com/ مين بمقدرتوا يجيب الكود الخاص بيها في عرض الاخبار في كل تاب لما بتضغط على الخبر بيطلع فوق وبيصير خبر رئيسي..
يوجد مثال عربي في موقع http://www.d1g.com/homepage/
تحياتي
| |
السلام عليكم..
يوجد في ياهو تابز رائعة جدا http://www.yahoo.com/ مين بمقدرتوا يجيب الكود الخاص بيها في عرض الاخبار في كل تاب لما بتضغط على الخبر بيطلع فوق وبيصير خبر رئيسي..
يوجد مثال عربي في موقع http://www.d1g.com/homepage/
تحياتي
الله يديم
سوالف سوفت - البحث في المنتدى
هذه أول درس
http://www.swalif.net/softs/swalif44/softs212740/
ثاني
http://www.swalif.net/softs/swalif44/softs212766/
ثالث
http://www.swalif.net/softs/swalif44/softs211771/
أرجو أن اكون أفدتك بشيئ
تحيااتي
__________________
قريبا أطلاق أول موقع سوري
لتطوير محتوى المواقع الرقمية السورية
شكرا لك اخي..
هذه الدروس انا حافظها ولكن اقصد ان كود اخبار الياهو بالظبط هو ما اريد...
الفكرة فبالي من فترة و خاصة أنها توفر علينا تكديس أخر الأخبار والمواضيع في وجه الزائرين ، وتوفر مساحة و تقلل حجم الصفحة الرئيسية ،
السلام عليكم ...
مجرد محاولة ربما تفيدكم ...
المثال مرفقكود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>News 01</title>
<style type="text/css">
#news-1{
background: #E8EFFF;
border: 1px #B3CAFF solid;
width: 400px;
padding: 10px;
}
#news-2{
background: #E8EFFF;
border: 1px #B3CAFF solid;
width: 400px;
padding: 10px;
}
#wcc-1{
background:#FCD6D7;
border:1px #CC0000 solid;
width:80px;
cursor:pointer;
padding:3px;
margin:10px;
float:left;
text-align:center;
}
#wcc-2{
background:#FFF;
border:1px #CC0000 solid;
width:80px;
cursor:pointer;
padding:3px;
margin:10px;
float:left;
text-align:center;
}
</style>
<script type="text/javascript">
function ShowNews2(){
var Nmain1 = document.getElementById('news-1');
var Nmain2 = document.getElementById('news-2');
var Nwcc_1 = document.getElementById('wcc-1');
var Nwcc_2 = document.getElementById('wcc-2');
Nmain1.style.display = "none";
Nmain2.style.display = "";
Nwcc_1.style.background = 'FFF';
Nwcc_2.style.background = 'FCD6D7';
}
function ShowNews1(){
var Nmain1 = document.getElementById('news-1');
var Nmain2 = document.getElementById('news-2');
var Nwcc_1 = document.getElementById('wcc-1');
var Nwcc_2 = document.getElementById('wcc-2');
Nmain1.style.display = "";
Nmain2.style.display = "none";
Nwcc_1.style.background = 'FCD6D7';
Nwcc_2.style.background = 'FFF';
}
</script>
</head>
<body>
<div id="news-1">
<p>News 01</p>
<p>Here a Default News 1 Text</p>
<p>Here a Default News 1 Text</p>
<p>Here a Default News 1 Text</p>
</div>
<div id="news-2" style="display:none">
<p>News 02</p>
<p>Here News 2 Text</p>
<p>Here News 2 Text</p>
<p>Here News 2 Text</p>
</div>
<br />
<div onclick="ShowNews1();" id="wcc-1">News 01</div><div onclick="ShowNews2();" id="wcc-2">News 02</div>
</body>
</html>
__________________
jQuery Reference Guide ISBN : 1847193811
Prototype and Scriptaculous in Action ISBN : 1933988030
Knowledge is Free
نسيت أقلك ان الدروس اللى انت حافضها أفضل من طريقتي بكثير ..........
لأن المثال اللى تقول عليه في الــ Yahoo يختلف في شكل التصميم فقط
يعني أقلب الـTAB من تحت لفوق و ابعد اللينكات و تحصل على نفس الشيئ :1power:
__________________
jQuery Reference Guide ISBN : 1847193811
Prototype and Scriptaculous in Action ISBN : 1933988030
Knowledge is Free
ضوابط المشاركة
رد مع اقتباس
المشاركة الأصلية كتبت بواسطة alrhieb 