چندین سال پیش اون اوایل کارم که روی وبلاگ کار می کردم به این فکر افتادم که یک فال حافظ درست کنم ، برای همین یک تعداد تصویر آپلود کردم و این کد یا اسکریپت رو گذاشتم تا هر بار یک عکس رو به کاربر نشون بده.شما تعدادی عکس آپلود می کنید و با استفاده ازین کد هر بار یک عکس که دارای سایز و لینک دلخواه شما هم می باشد رو به صورت شانسی و رندوم انتخاب می کنه و نشون میده که یک دمو هم ازش در انتهای مطلب قرار دادم.

کد نمایش عکس و تصاویر تصادفی

کد تصاویر تصادفی

اسکریپت یا کدی که در زیر قرار دادم به صورت جاوااسکریپت هستش که می تونید داخل صفحات و قالب سایت یا وبلاگ خودتون ازش استفاده کنید ، و همینطور می تونید اونو به صورت js ذخیره کنید و فقط آن را فراخوانی کنیدش ، که اگر فراخوانی رو هم بلد نیستید من در آخر یه کوچولو بهش اشاره می کنم.


<script type="text/javascript" language="JavaScript">// <![CDATA[

// !!! Reload page
// add 1,2,3 'img'
var NumberOfAds = 5;
var now = new Date()
var sec = now.getSeconds()
var AdNumber = sec % NumberOfAds;
AdNumber +=1;
if (AdNumber==1)
{
url="http://doctorwp.com";
Graphic="http://doctorwp.com/wp-content/uploads/2013/03/1.png";
width = "124"
height = "124"
}
if (AdNumber==2)
{
url="http://doctorwp.com";
Graphic="http://doctorwp.com/wp-content/uploads/2013/03/2.png";
width = "124"
height = "124"
}
if (AdNumber==3)
{
url="http://doctorwp.com";
Graphic="http://doctorwp.com/wp-content/uploads/2013/03/3.png";
width = "124"
height = "124"
}
if (AdNumber==4)
{
url="http://doctorwp.com";
Graphic="http://doctorwp.com/wp-content/uploads/2013/03/4.png";
width = "124"
height = "124"
}
if (AdNumber==5)
{
url="http://doctorwp.com";
Graphic="http://doctorwp.com/wp-content/uploads/2013/03/5.png";
width = "124"
height = "124"
}
document.write('<center>');
document.write('<a href=\"' + url + '\">');
document.write('<img src=\"' + Graphic + '\" width=') document.write(width + ' height=' + height + ' '); document.write('border=0>
');
document.write('</a>');
document.write('</center>');
// ]]></script>

فقط چند نکته رو ذکر می کنم.

در اول کد تعداد مجموع تصاویری که هستن و باید به صورت تصادفی از بین آنها انتخاب شود ذکر شده ، شما باید اون عدد ۵ رو که الان هستش را به تعداد تصاویر خودتون تغییر بدید.

همونطور که می بینید من پنج تصویر رو داخل اسکریپت گذاشتم ، شما اگر تعداد تصاویرتون بیشتر یا کمتر هستش خودتون طبق همون فرمولی که مشخصه از داخل کد تصویر اضافه و یا کم کنید.

همونطورم که میبینید شما می توانید برای هر تصویر به صورت جداگانه لینک و سایز نمایش انتخاب کنید که برای تصاویر من ۱۲۴ در ۱۲۴ هستش و لینک سایت خودم ، شما تغییرش بدین.

فراخوانی فایل اسکریپت

مطلب بالا برای تصاویر تصادفی تمام شد ، ولی اگر دوست دارید تا کد بالا رو جداگانه به صورت js ذخیره و آپلود کنید ، فقط کافیه که با یک خط کد زیر اون رو در قالب خودتون فراحوانی کنید.


<script type="text/javascript" language="javascript" src="http://.../code.js"></script>

همونطور که دیدید باید آدرس فایل آپلود شده رو وارد کنید.

همچنین در مطالب دیگر سایت کد نمایش جملات تصادفی و قصار رو قرار داده ایم که می تونید از اون کد هم استفاده کنید.

———

مشاهده دموی اسکریپت تصاویر تصادفی – صفحه باز شده رو رفرش کنید تا ببینید هر بار تصویر تصادفی میاره.

این آموزش به درخواست آقا محمد از بازدیدکنندگان سایت نوشته شد ، با تشکر از ایشون.اگر شماهم مطلبی مدنظر دارین بگین تا ما دربارش بنویسیم.ممنون

امتیاز شما از 1 تا 5
1 ستاره میدم به نوشته2 ستاره میدم به نوشته3 ستاره میدم به نوشته4 ستاره میدم به نوشته5 ستاره میدم به نوشته 2 رای
Loading...