1. مهمان گرامی، جهت ارسال پست، دانلود و سایر امکانات ویژه کاربران عضو، ثبت نام کنید.
    بستن اطلاعیه

افکت ( ) fadeTo در jQuery

شروع موضوع توسط minaaa ‏31/8/13 در انجمن JQuery

  1. کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    در این بخش از آموزش jquery ، افکت fadeTo را در طراحی سایت آموزش می دهیم.
    افکت fadeTo میزان شفافیت و وضوح نمایش یک عنصر را به تدریج به یک مقدار تعیین شده از سوی کاربر تغییر می دهد .
    به عبارت دیگر افکت fadeTo میزان نور نمایش یک عنصر را کم یا زیاد می کند . شکل کلی استفاده از این متد به شرح زیر است :
    $ ( " selector " ).fadeTo ( speed , opacity , callback )
    selector : selector عنصری است که این افکت باعث تغییر وضوح نمایش آن می شود .

    speed : این پارامتر در این متد اجباری بوده و حتما باید مقدار دهی شود . در غیر این صورت افکت کار نخواهد کرد .
    این پارامتر سرعت تغییر وضوح تصویر عنصر توسط افکت را تعین می کند .
    این پارامتر به دو صورت قابل مقداردهی می باشد .
    تعیین به وسیله زمان بر حسب میلی ثانیه : در این حالت مدت زمانی که می خواهید در آن وضوح تصویرعنصر تغییر کند را نعیین می کنید . مثلا 100 ms .
    تعیین بر اساس 3 حالت کلی زیر : در این حالت با انتخاب یکی از 3 مقدار زیر سرعت تغییر وضوح تصویر عنصر را آرام ، معمولی و یا سریع انتخاب می نمایید .
    "slow"
    "normal"
    "fast"

    opacity :این پارامتر در این متد اجباری بوده و حتما باید مقدار دهی شود . در غیر این صورت افکت کار نخواهد کرد . .
    این پارامتر میزان تغییر وضوح تصویر عنصر را تعیین می کند . مقداری که به این پارامتر می توان داد باید عددی بین 0.0 تا 1 باشد و هر چه عدد انتخاب شده کمتر باشد ، وضوح تصویر عنصر هم کمتر خواهد بود .
    callback : توسط این پارامتر می توان نام یک تابع را تعیین کنید تا پس از پایان یافتن اجرای افکت و تغییر وضوح تصویر عنصر مورد نظر ، آن تابع اجرا شود .
    به کار بردن این پارامتر اختیاری است .

    مثال زیر کاربرد افکت fadeTo را نشان میدهد:
    $("button").click(function(){
    $("p").fadeTo(1000,0.4);
    });
    مثال زیر روش استفاده از متد fade را با مقادیر متفاوت نشان می دهد :
    $("button").click(function(){
    $("#div1").fadeTo("slow",0.15);
    $("#div2").fadeTo("slow",0.4);
    $("#div3").fadeTo("slow",0.7);
    });