د jQuery کتابتون: ستا د سایټ لپاره سلایډونه

د وخت په تېرېدو او د ویب ډیزاین په ساحه کې د ټکنالوجۍ پراختیا بدلول او د سایټونو محتوا ته د کاروونکو اړتیاوو اړتیاوې دي. که چیرې مخکې دا د ډیری موضوعاتی انځورونو سره متناسب متن وي، نن ورځ ګرافیک برخه لویه برخه ده. دا تاسو ته اجازه درکوي چې په لنډ وخت کې ډیر ګټور او ګټور معلومات ترلاسه کړئ، او د اوږدې لیکنو لوستلو وخت مه ضایع کړئ. په دې اړه، ډیر مشهور او یا هم، د ویب پاڼو یو اړین عنصر سلایډونکي دي. دوی په دوی کې د مختلفو منځپانګو سره بلاکونه دي - له عکسونو پورې اړیکو پورې. د دې ویب اعتراض اضافه کولو لپاره یوه عصري لاره د jQuery کتابتون کارول دي. هغه سلایډونکي چې د دې وسایلو په مرسته جوړ شوي، اسانتیا لري، کارول اسانه دي، او ډیر اغیزمن ښکاري. بله، موږ به وګورو چې څنګه د یوې ویب پاڼې ځانونه ځانونه جوړ کړو. د پام وړ لوی شمیر معياري توکیو څخه مننه، دا د ممکنه ده چې د بیلابیلو ډولونو او متنوع محتوياتو jQuery sliders تطبیق شي.

څنګه یو ویب پاڼه ته یو سلائیڈر اضافه کړئ؟

د سایټ پاڼې ته د سلایډونو زیاتولو لپاره ډیری لارې شتون لري. ډیری وختونه، تاسو حتی د HTML کوډ لیکلو ته اړتیا نلرئ او سکریپټ ته لاړ شئ. دلته ډیر وړیا کتابتونونه شتون لري چې کاروونکي یې مخکې چمتو شوي ټیمونه وړاندې کوي، کوم چې ستاسو د ویب پاڼې ته د jQuery sliders زیاتولو اجازه ورکوي. ټول هغه څه چې تاسو ورته اړتیا لرئ دا دا ده چې دا د خپل ویب پاڼې سرچینه کوډ کې کاپي کړئ او پایلې خوند واخلئ. په هرصورت، په دې حالت کې، ستاسو د تخليقي فنونو د احساس کولو امکانات محدود دي. نو ځکه، دا به ډیر ښه وي چې د دې ډیزاین عنصر ځان ځانته پیدا کړي. د دې کولو لپاره، تاسو باید پوه شئ چې د یو ساده jQuery سلائیڈر پلي کولو څرنګوالی، او تاسو کولی شئ چې دا کوډ کې اضافي عناصر زیاتولو سره دا پیچلې کړئ.

پخپل ځان یو سلائیډ جوړ کړئ: په HTML کې کوډ

د پیل کولو لومړی شی د راتلونکی سلائیڈر ترتیبول دي.

1. په HTML فایل کې د سلید شو بند جوړول، کوم چې زموږ ټول سلایډونه (انځورونه او نور) به شامل وي.
2. په دې کې موږ د ul لست لیږو، هر یو توکي به یو جلا سلایډ ذخیره کړي.

په سي ایس ایس کې کار کول

بل، د دې لپاره چې د سی ایس ایل سند کارولو سره د اندازې اړین ځانګړتیاوې پلي کړئ. دا اړینه ده چې د jQuery منځپانګې سلائیډر چې موږ یې جوړ کړی سم سم کار کوي او اړتیا لیدل کیږي. پدې مرحله کې، موږ لاندې دندې لرو:

• د سلائیډ شو بلاک یوازې د یووازې کولو لپاره، اوس مهال اړتیاو سلید (تصویر یا منځپانګې)، او پاتې پاتې شوي پټ شوي؛
• د بلې ښي خوا څخه (د سلونو څخه ترتیب کړئ)
• هغه کانټینر جوړ کړئ چې په هغه کې سلیدونه ذخیره شوي، وړ وړ (ښي او ښي).

د دې کولو لپاره، موږ لاندې پیډیمرونه د CSS CSS کې ټاکئ:

• د سلاید شو لپاره: د زغملو-x- اسټرالول، اوسپنه - y - پټ:
• د الات لپاره

تاسو کولی شئ چوکۍ، قد، پس منظر، او داسې نور تنظیم کړئ.

موږ کوډ په jQuery کې لیکئ

په HTML او CSS کې، ټول اړین بدلونونه شوي دي. دا د jQuery لپاره د کوډ لپاره پاتې دی، هغه سلایډونکي چې پکې باید لاندې پیرامیټونه ولری:

• سلایډونه باید د یو بل خاص وخت سره یو بل بدل کړي؛
• کله چې تاسو خپل مایکري کرسر ته ګورئ ، دوی حرکت باید ودروي.

د دې کولو لپاره، دوه متغیرونه بیان کړئ: سلیدویډ (د سلائډ په اندازه) او د سلید پواسطه (د سلائډ بدلون موده مشخصوي). ټیکر به پیل شي کله چې د سایټ پاڼه بشپړه شي. د دې پیرامیټر لپاره موږ د مایکرو کرسر ځړول په سلائډ کې لرې کړو (کوم چې د سلائډ بدلون بندوي).

ډاډ ترلاسه کړئ چې د کانټینر الات مشخص کړئ. دا به د هر سلائیډ د اوږدوالي له مخې ضایع شوي سلائونو سره مساوي وي.

موږ هغه فعالیت چټک کوو چې د سلایدونو بدلولو مسوولیت لري. دا ټول، تاسو کولی شئ د خپل سلائیډ کار وګورئ.

پایله

په دې مقاله کې، موږ په خپلو خبرو کې د jQuery sliders جوړولو په اړه خبرې اترې وکړې. د ساده سلائیڈر پلي کولو یو مثال کارول، تاسو کولی شئ خپل تعبیرات خپل توپیرونه رامنځته کړئ، د سرچینې کوډ کې مناسب بدلونونه رامنځته کړئ. دا به ډیزاین ته وده ورکړي او ستاسو د سایټ کارول د لیدونکو لپاره خورا اسانه کړي.