انٹرنیٹویب ڈیزائن

JQuery لائبریری: آپ کی ویب سائٹ کے لئے sliders

وقت گزرنے اور ویب ڈیزائن کے میدان تبدیل ہو رہے ہیں اور ضروریات / مواد کی سائٹس کو صارفین کی ضروریات میں ٹیکنالوجی کی ترقی کے ساتھ. یہ زیادہ تر موضوعاتی تصاویر کی ایک چھوٹی سی تعداد کے ساتھ متن مواد تھا اس سے قبل، تو آج یہ گرافک کی غالب عنصر ہے. یہ آپ کو فوری طور پر سب سے زیادہ ضروری اور مفید معلومات حاصل کرنے کے لئے، اور طویل نصوص پڑھنے کا وقت برباد نہ کرو اجازت دیتا ہے. اس تیزی سے مقبول اور حقیقت میں، کے سلسلے میں، ایک ویب کے صفحے کے ایک ضروری عنصر sliders ہیں. تصاویر سے لنکس کو - وہ ان میں مواد مختلف کے ساتھ بلاکس ہیں. JQuery لائبریری کا استعمال کرتے ہوئے - ایک دیئے گئے ویب اعتراض شامل کرنے کا ایک جدید طریقہ. اس آلے کے ساتھ پیدا sliders کے، استعمال کرنے میں آسان، ایک آرام دہ ہو جاؤ، اور بہت متاثر کن لگ رہا ہے. اگلی ہم اپنے طور پر ویب صفحات کے ان عناصر کو بنانے کے لئے کس طرح دیکھو. معیاری اوزار کی ایک کافی بڑی تعداد کا شکریہ، یہ jQuery سلائیڈر قسم اور متنوع مواد کو لاگو کرنے کے لئے ممکن ہے.

کس طرح ایک ویب صفحے پر ایک سلائیڈر شامل کرنے کریں؟

ایک سلائڈ کے بلاکس کو شامل کرنے کے طریقے کے صفحے پر نمبر. اکثر ایسا ہوتا ہے یہاں تک کہ ایچ ٹی ایم ایل کوڈ کو لکھنے اور اسکرپٹ میں delve کرنے کی ضرورت نہیں. صارفین آپ اپنی سائٹ پر jQuery-sliders کا اضافہ کرتے ہیں کہ ایک ریڈی میڈ ٹیمپلیٹس پیشکش مفت لائبریریوں کی کافی تعداد موجود ہے. آپ کو صرف اتنا کرنا ہے - آپ کے ویب صفحے کے سورس کوڈ میں کاپی اور نتائج سے لطف اندوز کرنے کے لئے ہے. تاہم، اس معاملے میں اپنے تخلیقی تخیل کی وصولی کے امکان محدود ہے. لہذا، یہ آزادانہ طور پر ڈیزائن عنصر پیدا کرنے کے قابل ہو جائے کرنے کے لئے مفید ہے. ایسا کرنے کے لئے آپ jQuery سادہ سلائیڈر لاگو کرنے کے لئے کس طرح پتہ کرنے کی ضرورت ہے، اور صرف، یہ پیچیدہ آپ کو ہمیشہ کوڈ میں اضافی عناصر کا اضافہ کر سکتے ہیں.

خود کی طرف سے ایک سلائیڈر بنائیں: HTML کوڈ میں

سب سے پہلے، کہاں سے شروع - سلائیڈر کے مستقبل ترتیب رجسٹر کرنے کے لئے ہے.

  1. HTML فائل سلائیڈ شو یونٹ، جو ہمارے سلائیڈوں کی تمام پر مشتمل ہوگا (تصاویر، وغیرہ) میں قائم کیا.
  2. اس UL فہرست بچھانے، جن میں سے ہر ایک پیراگراف ایک علیحدہ سلائڈ محفوظ کرے گا.

ہم سی ایس ایس کے ساتھ کام کر رہے ہیں

پھر ہم اس پر CSS-دستاویز کا استعمال کرتے ہوئے مطلوبہ سٹائل کی خصوصیات لاگو ہوتے ہیں. یہ مناسب طریقے سے کام کرنے کے لئے ہماری مواد jQuery سلائیڈر مسلط کرنا ضروری ہے اور صحیح نظر تھا. اس مرحلے پر، ہم نے مندرجہ ذیل کاموں کے ساتھ سامنا کر رہے ہیں:

  • کہ سلائیڈ شو یونٹ پر صحیح وقت سلائڈ (یا تصویر مواد) میں صرف ایک دکھاتا ہے، اور باقی چھپے ہوئے تھے اس بات کو یقینی بنانے کے؛
  • سلائڈ دوسرے (بائیں سے دائیں) کے بعد ایک کا انتظام؛
  • جنگم (بائیں اور دائیں) سلائڈ ذخیرہ جو شیخ الاسلام کنٹینر، ایسا.

ایسا کرنے کے لئے سی ایس ایس فائل میں مندرجہ ذیل اختیارات مقرر:

  • سلائیڈ شو کے طور پر: اتپرواہ-X - کتاب، اتپرواہ-Y - پوشیدہ:
  • شیخ الاسلام کے لئے: فلوٹ - چھوڑ دیا.

اس کے علاوہ آپ کی چوڑائی کے پیرامیٹرز (چوڑائی)، اونچائی (اونچائی)، پس منظر (پس منظر) اور اسی طرح متعین کر سکتے ہیں.

ہم jQuery میں اس کوڈ کو ڈال دیا

HTML اور CSS تمام ضروری تبدیلیاں کی گئی ہیں. یہ مندرجہ ذیل پیرامیٹرز ہونا چاہئے جس jQuery کوڈ، sliders کے، لئے مقدمہ ہے:

  • سلائیڈیں ایک مخصوص وقت وقفہ کے ساتھ ایک دوسرے کو کامیاب کرنا چاہئے؛
  • تم ہوور جب پر ماؤس پوائنٹر ان کی تحریک کو موقوف کرنا چاہئے.

slidewidth اور slidertime (سلائڈ کی لمبائی کے برابر) (کا تعین سلائڈ شو کی مدت): ایسا کرنے کے لئے، ہم دو متغیر کا اعلان. صفحہ پوری طرح سے لوڈ کی ویب سائٹ ہے جب ٹائمر شروع ہو جائے گا. اس پیرامیٹر کے ذریعے ہم ایک سلائڈ (سلائڈ شو رک جاتا ہے) کے لئے ماؤس پوائنٹر طرف اشارہ کرتے ہوئے کی کارروائی باندھنے.

شیخ الاسلام کنٹینر لمبائی لکھ کرنا نہ بھولیں. یہ ہر ایک سلائڈ کی لمبائی سے ضرب سلائیڈوں کی تعداد کے برابر ہو جائے گا.

سلائڈ کو تبدیل کرنے کے لئے ذمہ دار تقریب داخل کریں. یہ ہے کہ آپ اپنے سلائیڈر کی کارکردگی کی جانچ کر سکتے ہیں ہے.

اختتام

اس مضمون میں ہم اس ویب سائٹ کے ایک صفحے داخل کرنے کے لئے ان کے اپنے jQuery سے sliders پیدا کرنے کے طریقے کی طرف دیکھا. ایک سادہ سلائیڈر کی مثال کا استعمال کرتے ہوئے، آپ کو، اس سے ان کی اپنی تشریح کے ساتھ آنے کے منبع کوڈ کو مناسب تبدیلیاں کر سکتے ہیں. یہ ڈیزائن کو بہتر بنانے اور آپ کی ویب سائٹ کے استعمال کے زائرین کے لئے زیادہ آسان بنا دے گی.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 ur.birmiss.com. Theme powered by WordPress.