بهترین راه اداره تصاویر شکسته

بهترین راه اداره تصاویر شکسته

ابتدا توجه کنید عکس شکسته منظور عکسی است که لود نشده است (احتمالا یافت نشده است). امروزه در طراحی سایت خیلی پیش میاد که مثلا آدرس عکس را اشتباه وارد کرده باشید یا سیستم های دینامیک آدرس عکس را اشتباه وارد کنند. بجز این در سایت‌های سنگین ممکنه بعضی از عکس‌ها لود نشوند و این فضایی بسیار زشت ایجاد می‌کند. امروز قرار است کدی برای شما قرار دهیم که اگر عکس شکسته بود آن را مخفی کند یا بجای آن یک تصویر پیش فرض نمایش دهد. کد اول مخفی کردن تصاویر شکسته:

$("img").error(function(){
    $(this).hide();
});

 این کد هنگام لود صفحه تصاویر شکسته را پیدا می کند و آن ها را از دید کاربران مخفی می‌نماید. و این هم کد جایگزینی تصویر:

$('img').error(function(){
    $(this).attr('src', 'error.jpg');
});

 این کد هم تصاویر شکسته را پیدا می کند و تصویر error.jpg را بجای آن قرار می‌دهد. پیشنهاد می‌شود این آدرس عکس را بصورت مستقیم وارد کنید نه آدرس نسبی. اما یه چیز جالب دیگه هم براتون دارم به کد زیر دقت کنید:

$('img').error(function(){
	alert("image not Found :\nurl : "+$(this).attr("src")+"\nclass : "+$(this).attr("class")+"\nid: "+$(this).attr("id"));
});

 این کد اطلاعات تصاویر ناقص را alert می کند و شما براحتی می توانید عکس شکسته را پیدا کنید و مشکلات آن را رفع نمایید.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد.