السلام عليكم
ابحث عن slideshow مثل اللي موجود في هذا الموقع
http://en.timeturk.com/Health-6-haberleri.html
| |
السلام عليكم
ابحث عن slideshow مثل اللي موجود في هذا الموقع
http://en.timeturk.com/Health-6-haberleri.html
و عليكم السلام ورحمة الله ..
تم استخراجها من الموقع و لله الحمد
ملف الـ index.html
نضع فيه التالي :
و تتكرر العميلة الى 8 الأخبار = عناوين .كود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Fez-Soft - swalif soft</title>
<link href="css/style.css?v7" type="text/css" rel="stylesheet">
<link href="css/news.css?v7" type="text/css" rel="stylesheet">
</head>
<body>
<div id="base" class="base">
<div class="base_middle" id="base_middle">
<div class="base_middle_inner">
<div class="middle_page_title">
<span>Titre Exemple</div>
<div class="headline">
<div class="image">
<a href="#" id="news_link">
<img id="news_image" src="http://en.timeturk.com/images/1x1.gif" alt="Manşetler"/></a>
</div>
<div class="transparent_layer"></div>
<div class="title_content">
<div class="title" id="news_title"></div>
<div class="short_content" id="news_short_content">
</div>
</div>
<div class="number">
<div class="number_inner">
<div class="item" id="headline_item_0">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر1" title="وصف العنوان 1" onmouseover="return HD_jumpTo(0)">1</a>
</div>
<div class="item" id="headline_item_1">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر2" title="وصف العنوان 2" onmouseover="return HD_jumpTo(1)">2</a>
</div>
<div class="item" id="headline_item_2">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر 3" title="وصف العنوان 3" onmouseover="return HD_jumpTo(2)">3</a>
</div>
<div class="item" id="headline_item_3">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر 4" title="وصف العنوان 4" onmouseover="return HD_jumpTo(3)">4</a>
</div>
<div class="item" id="headline_item_4">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر 5" title="وصف العنوان 5" onmouseover="return HD_jumpTo(4)">5</a>
</div>
<div class="item" id="headline_item_5">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر 6" title="وصف العنوان 6" onmouseover="return HD_jumpTo(5)">6</a>
</div>
<div class="item" id="headline_item_6">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر7" title="وصف العنوان 7" onmouseover="return HD_jumpTo(6)">7</a>
</div>
<div class="item" id="headline_item_7">
<a href="عنوان الصفحة التي تأخذ الزائر عد الضغط على رقم الخبر 8" title="وصف العنوان 8" onmouseover="return HD_jumpTo(7)">8</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/headline.js"></script>
<script type="text/javascript">
var news_data = {
0: {id: "17157", title: "grand titre 1 ", short_content: "petit description de premier paragraphe .", image: "18784", seo_link: "lien1.html"},
1: {id: "16504", title: "grand titre 2 ", short_content: "petit description de 2 eme paragraphe .", image: "8860", seo_link: "lien2.html"},
2: {id: "16481", title: "grand titre 3", short_content: "petit description de 3 eme paragraphe .", image: "18150", seo_link: "lien3.html"},
3: {id: "16088", title: "grand titre 4 ", short_content: "petit description de 4 eme paragraphe . ", image: "17820", seo_link: "lien4.html"},
4: {id: "12018", title: "grand titre 5 ", short_content: "petit description de 5 eme paragraphe .", image: "13786", seo_link: "lien5.html"},
5: {id: "11900", title: "grand titre 6 ", short_content: " petit description de 6 eme paragraphe .", image: "13668", seo_link: "lien6.html"},
6: {id: "11735", title: "grand titre 7 ", short_content: "petit description de 7 eme paragraphe .", image: "13521", seo_link: "lien7.html"},
7: {id: "11599", title: "grand titre 8 ", short_content: "petit description de 8 eme paragraphe .", image: "13387", seo_link: "lien8.html"}
};HD_forwClick();
</script>
</body>
</html>
Titre Exemple = هو العنوان الكبير الذي يكون فوق الـ slideكود PHP:<div class="middle_page_title">
<span>Titre Exemple</div>
لاحظ أنني وضعت تعليقات بالعربية داخل أماكن الروابط ..
مثال :
عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر1 : اي الرقم الموجود فوق على اليمينكود PHP:<div class="item" id="headline_item_0">
<a href="عنوان الصفحة التي تأخذ الزائر عند الضغط على رقم الخبر1" title="وصف العنوان 1" onmouseover="return HD_jumpTo(0)">1</a>
</div>
وصف العنوان 1 : و هو وصف يظهر عند تمرير الفأرة على الرقم الموجود فوق على اليمين .. وهي عمل title وهذا معروف .
بالنسبة لكود الجافا سكربت الذي في الصفحة سآخذ منه طرف وهو الأول فقط :
grand titre 1 : وهو العنوان الكبير الذي يظهر في الخبر الذي فوق الصورة .كود PHP:0: {id: "17157", title: "grand titre 1 ", short_content: "petit description de premier paragraphe .", image: "18784", seo_link: "lien1.html"},
lien1.html : هو الرابط الذي سيأخذني إليه عند الضغط على صورة الخبر و ليس العدد ، وهو نفس الرابط الذي وضعناه فوق ..فقط للتفرقة هنا الضغط على الصورة .
image: "18784" : هنا اسم الصورة .. ولكن لو تأملت فنحن لا نعرف ان هناك صورة بلا امتداد ؟؟؟؟
ولكن الامتدادت عملت في ملف الجافا سكرلابت الذي استدعيته في أول كود الجافا سكربت :
لو دخلنا للملف سنجد انه تتم تحديد المتدادت بـ jpg و كذلك تم تحديد مجلد الصور بـ images لذلك نأخذ اسم الصورة فقط دون امتداد و نضعه في الكود image: "18784" ، الاسم هو 18784 أما الاسم الكامل هو 18784.jpgكود PHP:<script type="text/javascript" src="js/headline.js"></script>
هنا الواقع
http://en.timeturk.com/images/news/18784.jpg
لذلك نضع الصور في المجلد images . ( هي كانت images/news/ ) انا جعلتها images فقط .
و هكذا تتكرر العملية للأخبار الـ 8 كلها واحد واحد .
هناك بعض الصور المستعمله كثل خلفية الأرقام و غير ذلك .. كل شيء تم ارفاقه مع التطبيق
هذا فقط شرح بسيط .. و إلا ففيالرابط كل شيء .. ( ملف html و ملفات css و js و الصور ) .
المساحة تعدت المسموح به في المرفقاتكود PHP:http://www.4shared.com/file/96944500/76430ed0/fez-soft-slidshow.html
ملاحظة واحدة فقط : وهي ان ملفات css حوالي 3 .. حاول تنقي ملف style.css لانه فيه كلاسات و معرفات لا حاجة لها في هذا التطبيق .. للعجلة لم أنقيه ..
لكن سهل ان شاء الله ...
موفق أخي إن شاء الله
ههههههههه جزاك الله خيرا فكرتنى بايام زمان اما كنت بستخرج اكواد الجافا سكريبت
انا مش جربت الكود بس حبيت اشكرك بالذكرى
والسلام ختام
__________________
اللهم ارحم امى وجميع موتى المسلمين
وصلى على نبينا محمد وعلى اله وصحبة اجمعين
بسم الله ما شاء الله
والله لا اعرف كيف اشكرك علي اخلاصك الطيب في مساعدتك لي
الله ينور الكود اشتغل 100%
وركبته واشتغل بشكل جيد للغاية
اشكرك مرة اخري
العفو أخي الكريم و الشكر كل الشكر لله تعالى ..ههههههههه جزاك الله خيرا فكرتنى بايام زمان اما كنت بستخرج اكواد الجافا سكريبت
انا مش جربت الكود بس حبيت اشكرك بالذكرى
والسلام ختام
و هذا أحد عيوب لغة الجافا سكربت .. قد يتعب الواحد أياما في برمجة شيء .. ثم يأتي آخر يفهم شيئا في اللغة و يأخذ له تعبه في 5 دقايق ..
العفو أخي الفاضل .. الشكر كل الشكر لله تعالى ..بسم الله ما شاء الله
والله لا اعرف كيف اشكرك علي اخلاصك الطيب في مساعدتك لي
الله ينور الكود اشتغل 100%
وركبته واشتغل بشكل جيد للغاية
اشكرك مرة اخري
شكرا على الابداع
مريت ,
ووجب الشكر للأخ
Fez-Soft
انت قلت تم ارفاقعها
ما اشوف ملف مرفق .. او قصدك انها بنفس الكود
العفو أخواني .. و الشكر كل الشكر لله تعالى .
الاخ الذي يسأل عن الملف المرفق
تفضل رابط التحميل :
4shared.com - online file sharing and storage - download fez-soft-slidshow.zip
وهو في الموضوع
موفق
شكرا للاخ Fez-Soft
تم التعديل عليه و هذه هي النتيجه
العراقي بيت جميع العراقيين ::: Aliraqis the home of all iraqis
اخى الكريم
جرّب هذه الخدمة الاحترافية
قد تفي بالغرض
أصنع عروض تقديمية و شاركها مع الآخرين او حملها !
__________________
محمد غراب ,,
موقع غراب | مجموعة غراب البريدية | اتصل بى
اعلانك بموقع بيج رانك 4 وترتيب ونشاط جيد بسعر رخيص مع هدية
الاخ سحاب لا تستغرب مساعدت الاخوان لك بهذه الطريقة فانت لك اليد الطولى - بعد الله - في مساعدة كثير من الاخوان هنا
بارك الله فيك
شكرا لك أخي شاطر على المجهود.
ولكن في المثال المرفق ليست هناك حركة في الصور لماذا ؟
هل بالامكان المساعدة في المثالين التاليين :
MBC.net - قناة إم بي سي 1 mbc Action,mbc3,mbc4,mbc2,mbc و mbc & panorama FM
و
http://www.phfsudan.org/
شكراً.
__________________
مجلتي الصغيرة
لم افهم كما تعنيه بالحركة ؟؟شكرا لك أخي شاطر على المجهود.
ولكن في المثال المرفق ليست هناك حركة في الصور لماذا ؟
هل بالامكان المساعدة في المثالين التاليين :
MBC.net - قناة إم بي سي 1 mbc Action,mbc3,mbc4,mbc2,mbc و mbc & panorama FM
و
http://www.phfsudan.org/
شكراً.
المثال المرفق لو تركته يعمل لوحده سيتم الانتقال بين الصور تلقائيا ، او في حالة ما عملت بالماوس hover على الرقم
الحركة تتم لمرة واحدة.
ولكن هل يمكن جعل الارقام تحت الصور على شكل فلاش ؟
واضافة ازرار Pause و Play لايقاف وتشغيل الرحكة ؟
هل يمكن استخراج الحركة من هذا الموقع : www.mbc.net ؟
شكراً.
__________________
مجلتي الصغيرة
ضوابط المشاركة
رد مع اقتباس
المشاركة الأصلية كتبت بواسطة Fez-Soft 