افکت ( ) hide در jQuery
در این بخش از آموزش jquery ، افکت hide را در طراحی سایت آموزش می دهیم.
افکت ( ) hide باعث مخفی شدن عنصر مورد نظر می شود . عمکلرد این افکت بسیار شبیه به افکت fadeOut می باشد . بوسیله افکت ( ) hide می توانید این اختیار را به کاربر بدهید تا عناصری را که در صفحه لازم ندارد ، مخفی کند .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).hide ( speed , callback )
افکت ( ) fadeTo در jQuery
در این بخش از آموزش jquery ، افکت fadeTo را در طراحی سایت آموزش می دهیم.
افکت fadeTo میزان شفافیت و وضوح نمایش یک عنصر را به تدریج به یک مقدار تعیین شده از سوی کاربر تغییر می دهد .
به عبارت دیگر افکت fadeTo میزان نور نمایش یک عنصر را کم یا زیاد می کند . شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).fadeTo ( speed , opacity , callback )
افکت ( ) fadeOut در jQuery
در این بخش از آموزش jquery ، افکت fadeOut را در طراحی سایت آموزش می دهیم.
افکت fadeOut باعث می شود تا عنصر مورد اثر آن به تدریج از حالت نمایان به حالت مخفی در بیاید. این افکت در یک افکت تصویری با کم کردن نور عنصر به تدریج باعث مخفی شدن آن از دید کاربر می شود .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).fadeOut ( speed , callback )
رویداد ( ) unload در jQuery
در این بخش از آموزش JQuery ، رویداد unload را در طراحی سایت شرح میدهیم.
رویداد unload زمانی
اتفاق می افتد که کاربر از صفحه جاری خارج می شود . برای مثال یکی ار
استفاده های جالب این رویداد ، می تواند صدور یک پیام خداحافظی برای کاربر
در زمانی که می خواهد صفحه را ببندد ، باشد .
رویداد unload در مواقع زیر رخ می دهد :
صفحه مجدد لود و فراخوانی شود .
رویداد ( ) submit در jQuery
در این بخش از آموزش JQuery ، رویداد submit را در طراحی سایت شرح میدهیم.
رویداد ( ) submit زمانی اتفاق می افتد که یک فرم submit شده و به سرور ارسال شود .
برای مثال از رویداد ( ) submit می توان برای صدور یک پیام هشدار به کاربر ، برای اعلام submit شدن فرم استفاده کرد . رویداد ( ) submit فقط با تگ form کار می کند .
شکل کلی استفاده از این متد به شرح زیر است :
Syntax $ ( " selector " ).submit ( ) ;
یا
$ ( " selector " ).submit ( function ) ;
selector : این پارامتر تعیین کننده id فرمی است که submit شده است .
function : تعیین کننده تابعی است که می خواهیم پس از submit شدن فرم ، اجرا شود .
مثال زیر کاربرد رویداد ( ) submit را نشان میدهد :
$("form").submit(function(){
alert("Submitted");
});
رویداد ( ) blur در jQuery
در این بخش از آموزش JQuery ، رویداد blur را در طراحی سایت شرح میدهیم.
رویداد blur
در jQuery زمانی اتفاق می افتد که کنترل یا عنصر مورد نظر فوکوس برنامه
را از دست می دهد. می تولنید کدها و توابع مورد نظر خود را طوری طراحی کنید
که در هنگام رخ دادن این رویداد ، اجرا شوند .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).focus ( function ( ) { ... some code ... } ;
selector : selector عنصر مورد نظری است که فوکوس برنامه را از دست می دهد . مثل یک کادر ورود متن که پس از پرکردن آن توسط کاربر و کلیک بر روی چیزی دیگر ، فوکوس را از دست می دهد .
function : این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود .
مثال زیر کاربرد رویداد blur را نشان میدهد :
$("input").blur(function(){
$(this).css("background-color","#ffffff");
});
زمانیکه عنصرمورد نظر از فرم فاکوس را از دست می دهد
رویداد ( ) hover در jQuery
در این بخش از آموزش JQuery ، رویداد hover را در طراحی سایت شرح میدهیم.
رویداد ( ) hover
، دو تابع را تعیین می کند که در هنگام عبور موس از روی عنصر مورد نظر ،
اجرا می شوند . تابع اول در هنگام ورود موس بر روی عنصر و تابع دوم در
هنگام خروح عنصر از روی عنصر اجرا می شود .
این رویداد هر دو رویداد mouseenter و رویداد mouseleave را فعال می کند .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).hover ( inFunction , outFunction ) ;
رویداد mouseleave در jQuery
در این بخش از آموزش JQuery ، رویداد mouseleave را در طراحی سایت شرح میدهیم.
رویداد mouseleave زمانی اتفاق می افتد که اشاره گر ماوس محتوای تگ html ترک می کند .
شکل کلی استفاده از این متد به شرح زیر است :
$(selector).mouseleave(function)
رویداد mouseenter در jQuery
در این بخش از آموزش JQuery ، رویداد mouseenter را در طراحی سایت شرح میدهیم.
رویداد mouseenter زمانی اتفاق می افتد که اشاره گر ماوس وارد محتوای تگ html می شود.
شکل کلی استفاده از این متد به شرح زیر است :
$(selector).mouseenter(function)
رویداد ( ) dblclick در jQuery
در این بخش از آموزش JQuery ، رویداد dblclick را در طراحی سایت شرح میدهیم.
رویداد dblclick زمانی اتفاق می افتد که کاربر بر روی عنصر مورد نظر دابل کلیک نماید . با رویداد dblclick برای مثال می توان کدی طراحی کرد که در هنگام دابل کلیک کاربر بر روی یک عنصر رنگ پس زمینه آن عوض شده و یا عنصر مخفی شود .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).dblclick ( function ( ) { ... some code ... } ;
رویداد ( ) click در jQuery
در این بخش از آموزش JQuery ، رویداد click را در طراحی سایت شرح میدهیم.
رویداد click
زمانی اتفاق می افتد که کاربر بر روی عنصر مورد نظر کلیک نماید . با این
رویداد برای مثال می توان کدی طراحی کرد که در هنگام کلیک کاربر بر روی یک
عنصر رنگ پس زمینه آن عوض شده و یا عنصر مخفی شود .
شکل کلی استفاده از این متد به شرح زیر است :
$ ( " selector " ).click ( function ( ) { ... some code ... } ;
selector : selector کنترلی است که کاربر بر روی آن کلیک می کند .
function : این تابع کد دستوری است که می خواهیم در هنگام رخ دادن رویداد ، انجام شود .
رویداد ( ) ready در jQuery
در این بخش از آموزش JQuery ، رویداد ready را در طراحی سایت شرح میدهیم.
رویداد ( ) ready در یک صفحه وب زمانی اتفاق می افتد که شی DOM به طور کامل لود شده و همچنین صفحه نیز به طور کامل لود شده باشد ( حتی تصاویر آن ) .شما می توانید رویدادها و توابعی که می خواهید به محض تمام شدن عملیات load صفحه ، اجرا شوند را در این تابع قرار دهید .
رویداد ها در جی کوئری (Jquery Events)
متدهای دسترسی به رویداد در JQuery جزء توابع اصلی و هسته ی اصلی جی کوئری هستند. Event Handler ها متدهایی هستند که وقتی «اتفاقی در صفحه HTML رخ می دهد» صدا زده می شوند.
در زیر چند مثال از متدهای رویداد در جی کوئری آورده شده است:
مقید کردن یک تابع به رویداد ready یک صفحه (وقتی که لود شدن صفحه کامل شد)
$(document).ready(function)
مطالب بیشتر را در ادامه مطلب بخوانید.
انتخاب گر ها در جی کوئری (Jquery Selectors)
سلکتور همونطور که از اسمش پیداست برای انتخاب کردن المنت ها (جهت اعمال کد روی اون‌ها) در جی کوئری بکار میرود. برای انتخاب یه عنصر HTML به صورت مستقیم میتوانیم آن را فراخوانی کنیم.
انتخاب همه عناصر (*)
$(*).hide()
با کد زیر میتوانید همه عناصر صفحه رو فراخوانی کنید.در این مثال همه عناصر با کلیک شدن ، hide میشوند.
قواعد دستوری جیکوئری ( Jquery )
با قواعد دستوری جیکوئری شما میتوانید عناصر HTML را انتخاب کنید و عملیات مورد نظر خود را بر روی آنها انجام دهید.
ساختار اصلی یک دستور جیکوئری :
$(selector).action()
$ : برای دسترسی به جیکوئری به کار میرود.
برای اینکه بتوانیم از امکانات jquery استفاده کنیم بایستی آخرین نسخه کتابخانه jquery رو از سایت jquery.com دانلود کنیم .
سه مدل برای دانلود وجود دارد :
بعد از دانلود شما باید کتابخانه را در صفحات خود نصب کنید .
طریق نصب جی کوئری به دو صورت inline و external می باشد.
اما نحوه نوشتن کدها نیز به همین دو روش میباشد :
در این بخش از آموزش css به توضیح ویژگی نمایش عناصر Cursor , Display , Visibility میپردازیم.
cursor
انواع مختلفی از نمایش مکان نما در صفحه را مشخص میکند.
زمانی که روی یک عنصری که مشخص کرده ایم میرویم مکان نما به شکل مورد نظر نشان داده میشود.
span.crosshair {cursor:crosshair}
span.help {cursor:help}
span.wait {cursor:wait}
float
در این بخش از آموزش css به توضیح ویژگی محل قرارگیری عناصر - خواص Clear , Float میپردازیم.
با این ویژگی از css موقعیت یک عنصررا می توانید سمت چپ یا راست تنظیم کنید.
یکی از پرکاربردترین ویژگی ها در css میباشد. بادادن این ویژگی به تگ ها شما میتوانید سایت های چند ستونه ایجاد کنید.
این خاصیت یکی از پایه های اساسی در طراحی قالب بر اساس div می باشد.
وقتی به یک عنصر در کد خود float به سمت چپ یا راست میدهید ، عنصر مورد نظر به آن سمت خاص میرود و بقیه عنصر هایی که بعد از تگ مذکور آمده اند و float ندارند به سمت مخالف رانده میشوند و اطراف عنصر مورد نظر قرار میگیرند.
.text
{
float:left;
width:110px;
height:90px;
margin:5px;
}
clear
اگر عنصر ی بعد از عنصری که ویژگی float را دارد، خاصیت clear داشته باشد، اطراف عنصر ی که ویژگی float را دارد قرار نمی گیرد.
عنصر ی که خاصیت clear=both دارد و float نیز شده باشد، فقط عنصر هایی را که قبل از خودش آمده است، clear میکند . و عنصرهای بعدی را تحت تاثیر قرار نمیدهد
img
{
float:left;
}
p.clear
{
clear:both;
}
این کد بروز بودن قیمت سکه و ارز را در هر روز در وبلاگ و سایت شما نشان خواهد داد.مثلا قیمت سکه های تمام طرح قدیم وسکه های تمام طرح جدید و سکه های ربع ونیم را نیز نشانگر می باشد.همچنین در ارز ها نیز نوع ارز قیمت خرید و قیمت فروش لحاظ شده است.که قیمت ها به تومان است.این کد نیز درهر روزآپدیت میشود در صورت آپدیت نشدن خطا را در نظرات وبلاگ گزارش کنید.
مشاهده جدول نرخ سکه 
دریافت کد نرخ سکه
مشاهده جدول نرخ ارز دریافت کد نرخ ارز
تگ لینک ( تگ Link )