كود عرض صورة عشوائية من مجلد؟

[alaneed]

السلام عليكم

أريد وضع هذا الكود في صفحة HTML هل من مساعد

[ابو الويس]

تفضل عزيزي كتبتلك الكود بالجافاسكريبت:

اول شي هذا الكود تضعه بالهيدر:

<script language="javascript">
var pic=new Array("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg");
var num=pic.length;
var ind=Math.round(Math.random()*(num-1));
</script>

وظيفته: اول سطر به مصفوفه تضع بها اسماء الصور! ثلني سطر يحسب عدد الصور بالمصفوفه والثالث يختار عدد عشوائي من ليكون فهرس المصفوفه حسب طولها. في مثالنا هذا يختار من 0 ل 5!!! لانه يوجد 6 صور

الان هذا الكود ضعه في اي مكان تريد للصوره ان تظهر:

<script language="javascript">
document.write("<img border='0' src='"+pic[ind]+"'>");
</script>

طبعا هكذا كل متعمل رفريش ستظهر صوره مختلفه!

ملاحظه : الصور يجب ان تكون بنفس المجلد الذي تضع به الكود!!
في الرد القادم ساكتب لك كود بحيث تحدد انت مكان الصور وايضا لكل صوره رابط!! يعني ينفع للاعلانات!

[ابو الويس]

لكي تحدد انت مكان الصور فقط اضف هذا السطر على الكود الاول..
طبعا قبل اغلاق وسم ال script!!

var dir="img";

بدون / في نهايته.. او تستطيع ان تحدد مسار كامل مثلا www.mysite.com/images
وطبعا تقدر تستعمل ال .. لترجع مجلد الى الخلف اظن انك تعرف هذه الاشياء!
ولو مع كل هذا الصور موجوده في نفس المجلد اترك ما بين القوسين "" فاضي.. وليس فراغ انما هكذا "".

بعد ان اضفت هذا السطر

استبدل الكود الخاص بالصوره بهذا الكود:

<script language="javascript">
document.write("<img border='0' src='"+dir+"/"+pic[ind]+"'>");
</script>

وهكذا انت تعرض صوره عشوائيه من المصفوفه وبالمجلد الذي حددته انت!

الان ماذا لو نريد ان نضع رابط للصور!
طبعا لو تريد ان تعمل رابط واحد تقدر تضيفه لوسم الصوره بالاسفل .. تقدر تضيف عادي قبل فتح وسم ال img تفتح وسم a وبعد الاغلاق تغلق وسم ال a

ليصبح الكود هكذا:

<script language="javascript">
document.write("<a href='http://yahoo.com' target='_blank'><img border='0' src='"+dir+"/"+pic[ind]+"'></a>");
</script>

هنا اصبحت كل الصور تحمل الرابط yahoo.com والعباره target=_blank يعني ان يفتح في صفحه منفرده وتقدر تحذفها اذا كنت تريد ان تفتح بنفس الصفحه


الان ماذا لو اردنا ان تكون لكل صوره رابط خاص بها!!

اذا نعمل مصفوفه اخرى تحت المصفوفه الخاصه بالصور ولكل واحد رابط!! بنفس الترتيب الخاص بالصور..
ونحدد في وضع الصوره الرابط حسب المصفوفه والرم العشوائي ليصبح الكود كامل :
--------------------------------- الكود مامل ----------------------- :
هذه في ال head مع تغيير الصور وروابطها بنفس الترتيب وتغيير مجلد ال الصور في السطر الاخير!

<script language="javascript">
var pic=new Array("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg");
var piclink=new Array("http://yahoo.com","http://walla.com","http://swalif.net","http://google.com","http://msn.com");
var num=pic.length;
var ind=Math.round(Math.random()*(num-1));
var dir="img";
</script>

وهذه في اي مكان تريد الصوره العشوائيه ان تظهر:

<script language="javascript">
document.write("<a href='"+piclink[ind]+"' target='_blank'><img border='0' src='"+dir+"/"+pic[ind]+"'></a>");
</script>

وتحياتي

[alaneed]

أخوي ابو الويس جزاك الله ألف خير وكل شيء تمام ولله الحمد وضابطة معي بس اللحين لو أبي مثلا أخلي الصورة

بحجم صغير لأن أنا الكود بحطه في بلوك في صفحة رئيسية حاليا يطلع لي الصور كبييرة أبيها تكون مثلا 100 *100

وفي حاجة ثانية أبي أسألك عنها نقدر نستخدم نفس الكود لأمور ثانية مثلا عبارات نصية ؟؟

[ابو الويس]

أخوي ابو الويس جزاك الله ألف خير وكل شيء تمام ولله الحمد وضابطة معي بس اللحين لو أبي مثلا أخلي الصورة

بحجم صغير لأن أنا الكود بحطه في بلوك في صفحة رئيسية حاليا يطلع لي الصور كبييرة أبيها تكون مثلا 100 *100

وفي حاجة ثانية أبي أسألك عنها نقدر نستخدم نفس الكود لأمور ثانية مثلا عبارات نصية ؟؟

عزيزي بالنسبه لطول وعرض الصوره... صع الجمله التاليه وراء border='0' ..
الجمله هي:

width='100' height='100'

وخلاص مع مراعاة الفراغات قبل وبعد الجمله. هذه الجمله تحدد ان طول الصوره 100 وعرضها 100
ولكن انتبه مثلا لو ان الصوره اصلا ليست مربعه فستظهر بشكل ليس جميل.. ممكن ان تضع فقط width لتحدد فقط العرض وبالتالي الارتفاع سيتحدد بالطريقه الملائمه مثلا لو الصوره هي 1000 * 600 اذا بعد ان تحدد فقط العرض هو 100 الارتفاع سيصبح 60 وهكذا الامر لو حددت فقط الارتفاع!

سؤالك الثاني!!
نعم طبعا تقدر تحط فقط نصوص.
مكان اسماء الصور حط النصوص التي تريدها ان تظهر. ومكان الكود الذي يعرض الصوره ضع:

<script language="javascript">
document.write("<a href='"+piclink[ind]+"' target='_blank'>"+pic[ind]+"</a>");
</script>

وتحياتي

[علوش السخنيني]

شكراً

[edafa.info]

بسم الله ماشاء الله عليك اخى الحبيب ابو الويس
شرحت فوفيت
جزاك الله كل خير