السلام عليكــم ورحمـة الله وبركاتــه ،،
أحاول أن أقوم بعمل صفحة index يعرض فيها مجموعة من المواضيع ومن ضمنها مربع هو عبارة عن صفحة أخرى news مثلا يتغير محتواها حسب الرقم الذي يتم أختياره
مثال أخبار الجزيرة الصورة والخبر يتغير حسب الرقم
لا أريده تماما مثل سكربت الجزيرة انما شئ بسيط يؤدي نفس الغرض مثلا صورة وكتابة تتغير
رغم محاولاتي والبحث الطويل إلا أني لم أصل إلى نتيجة ربما لعدم معرفتي بلغة الجافا سكربت
ولكن من الجيد وجود فريق عربي يمكن الرجوع إليه للأستفادة من الخبرات الجماعية
اذا كان مقالاتك dynamic اى ستضيف جديد وتعدل وتحذف فيمكنك عمل فلتره باستخدام sql حسب الرقم الموجود فى الرقم في ال url ومنها تظهر اخبار مقالات ,,,,
اما اذا كانت المقالات ثابتة فيمكنك عمل فريم داخل الصفحة وكل لنك يظهر صفحة معينة داخل الفريم
بالتوفيق
شكراً لك اخي الكريم على ردك الطيب
رغم تفاجئي بعدد الردود في مثل هذا الموقع العملاق
فعلا انا استخدم قاعدة بيانات
لكن المشكلة اني اريد تغيير محتوى الصفحة الداخلية دون تحميل البيانات من جديد وإلا كنت أستخدمة الأجاكس
اذا نظرت إلى المثال "أخبار الجزيرة " تجد كل الأخبار تحمل مرة واحدة ثم تقوم بالتنقل بينها بالأرقام دون تجديد التحميل
هل الموضوع صعب لهذه الدرجة أم أن الجميع لم يعرضو كود مشابه
أثناء بحثي وجت اسكربت يقوم بتغيير الصورة وفق ما تختارة من الكمبو بكس ولكن تغيير محتوى صفحة أخري شئ مختلف
هذا كود السكربت
<form name="dynamicselector">
<table border="0" width="250" cellspacing="0" cellpadding="0" height="60">
<tr>
<td width="35%" valign="top" align="left">
<select name="dynamicselector2" size="1" onChange="generateimage(this.options[this.selectedIndex].value)">
<option value="" selected>اختر الصورة</option>
<option value="036.gif">صورة رقم 1</option>
<option value="103.gif">صورة رقم 2</option>
<option value="105.gif">صورة رقم 3</option>
<option value="131.gif">صورة رقم 4</option>
<option value="216.gif">صورة رقم 5</option>
</select>
<script>
/*
Dynamic Image selector Script-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/
function generateimage(which){
if (document.all){
dynamic3.innerHTML='<center>Loading image...</center>';
dynamic3.innerHTML='<img src="'+which+'">';
}
else if (document.layers){
document.dynamic1.document.dynamic2.document.write('<img src="'+which+'">');
document.dynamic1.document.dynamic2.document.close();
}
else
alert('You need NS 4 or IE 4 to view the images!');
}
</script>
</td>
<td width="65%" valign="top" align="left"><ilayer id="dynamic1" width="100%" height="178"><layer id="dynamic2" width="100%" height="178"><div id="dynamic3"></div></layer></ilayer></td>
</tr>
</table>
</form>كنت قد رددت عليك وأنا في الخارج ولكن قبل عملية الإرسال نفذت البطارية من المحمول :) ولم يتم ارسال الرد , هذا قدرك :)
على كل كنت كاتب وأكيد إلى الآن موجود الرد على المحمول بس بتعرف قلة الحيله بدي أروح أشغله وقصه , لا بعيد الرد مرة ثانيه ولا إني أقوم وأغلب حالي <_<
الحل هو وضع الخبر والصورة في ديف (div) وإخفاء هذا الديف وتسميته بإسم آخرة رقم وهكذا مع جميع الأخبار
ثم تقوم بعمل دالة تأخذ متغير واحد تقوم هذه الدالة بإخفاء جميع الديفز (divs)وإظهار الديف الذي ينتهي إسمه بالرقم الموجود بالمتغير
سأقوم بعمل مثال
<style>
.ne{
border: 5px;
border-style: dotted;
width: 200px;
}
</style>
<body onload="show_news(3)"> .
<script>
function show_news(numb){
var i=1;
for (i=1;i<=5;i++){
document.getElementById('a_' +i).style.visibility='hidden';
document.getElementById('a_' +i).style.display = 'none';
}
document.getElementById('a_' +numb).style.visibility='visible';
document.getElementById('a_' +numb).style.display = 'block';
}
</script>
bla bal bla bla bla bla bla bla <br />bla bla bla bla <br />bla bla bla
bla bla bla bla <br />bla bla bla <br />bla bla bla <br />bla bla
<div>
<div id="a_1" class="ne">bla bla bla bla1 <img src="/style_emoticons/default/Bg_016.gif" alt="" /></div>
<div id="a_2" class="ne">bla bla bla bla2 <img src="/style_emoticons/default/004.gif" alt="" /></div>
<div id="a_3" class="ne">bla bla bla bla3 <img src="/style_emoticons/default/001.gif" alt="" /></div>
<div id="a_4" class="ne">bla bla bla bla4 <img src="/style_emoticons/default/Bg_017.gif" alt="" /></div>
<div id="a_5" class="ne">bla bla bla bla5 <img src="/style_emoticons/default/009.gif" alt="" /></div>
</div>
<a href="#" onclick="show_news(1)"> 1 </a>|
<a href="#" onclick="show_news(2)"> 2 </a>|
<a href="#" onclick="show_news(3)"> 3 </a>|
<a href="#" onclick="show_news(4)"> 4 </a>|
<a href="#" onclick="show_news(5)"> 5 </a>
bla bal bla bla bla bla bla bla <br />bla bla bla bla <br />bla bla bla
bla bla bla bla <br />bla bla bla <br />bla bla bla <br />bla bla
bla bal bla bla bla bla bla bla <br />bla bla bla bla <br />bla bla bla
bla bla bla bla <br />bla bla bla <br />bla bla bla <br />bla bla
bla bal bla bla bla bla bla bla <br />bla bla bla bla <br />bla bla bla
bla bla bla bla <br />bla bla bla <br />bla bla bla <br />bla bla
</body>
*ملاحظة هذه المقاله مكانها في منتدى الجافاسكريبت وليس هنا وهذا سبب قلة الردود
سبب التعديل إرفاق صورة عن المثال.
تم تعديل هذه المشاركة بواسطة bastr3 في 29 أبريل 2009 في 01:00
CMS Sfhati , Website Generator
نظام إدارة المحتوى صفحتي ... جربه الآن
أشكرك أخي bastr3 على ردك الطيب
فعلا حللت المشكلة
جازاك الله عني خير الجزاء
فقط حللت لي مشكلة
لكن ضهورها جميعا معا في البداية أمر مزعج
ثم لا يوجد تبديل زمني بينها
لا أريد أن أثقل عليك ولكني لا أعلم شئ تقريبا عن الجافا اسكربت
أخي yaco_ara
جربت إستخدام دالة include لكنها لا تقوم بتحميل متقيرات إلى الصفحة الهدف
تم تعديل هذه المشاركة بواسطة نيزك في 3 مايو 2009 في 15:16
اعتقد اني وجدت الحل للظهور الأولي يمكننا إضافة الكود في تعريف div لكل خلية كالتالي
<div> <div id="a_1" class="ne" style="display:none ">bla bla bla bla1 <img src="/style_emoticons/default/Bg_016.gif" alt="" /></div> <div id="a_2" class="ne" style="display:none ">bla bla bla bla2 <img src="/style_emoticons/default/004.gif" alt="" /></div> <div id="a_3" class="ne" style="display:none ">bla bla bla bla3 <img src="/style_emoticons/default/001.gif" alt="" /></div> <div id="a_4" class="ne" style="display:none ">bla bla bla bla4 <img src="/style_emoticons/default/Bg_017.gif" alt="" /></div> <div id="a_5" class="ne" style="display:none ">bla bla bla bla5 <img src="/style_emoticons/default/009.gif" alt="" /></div> </div>
فكيف يتم التقليب الزمني
تم تعديل هذه المشاركة بواسطة نيزك في 3 مايو 2009 في 15:27
:)
التبديل بينهم في عدة طرق ... الطريقة التقليدية هي من خلال دالة
var t=setTimeout("javascript statement",milliseconds);
والطرق الجديده هي إستخدام المكتبات مثل jquery بتعطي إفيكت وفيد إن وآوت مع ظهور كل خبر
CMS Sfhati , Website Generator
نظام إدارة المحتوى صفحتي ... جربه الآن
أين يتم وضعها هل من مثال
أنا لست قويا في الجافا سكريبت ولكن هذا ماتوصلت له :)
قم بتغيير السكريبت إلى :
<script>
var numb_auto=1;
function show_news(numb){
var i=1;
for (i=1;i<=5;i++){
document.getElementById('a_' +i).style.visibility='hidden';
document.getElementById('a_' +i).style.display = 'none';
}
document.getElementById('a_' +numb).style.visibility='visible';
document.getElementById('a_' +numb).style.display = 'block';
numb_auto=numb_auto+1;
if(numb_auto==6){numb_auto=1;}
setTimeout("show_news("+numb_auto+")",5000);
}
</script>CMS Sfhati , Website Generator
نظام إدارة المحتوى صفحتي ... جربه الآن