در جلسه سیزدهم دوره آمورشی فریم ورک بوت استرپ و در ادامه مبحث جاوااسکریپت در بوت استرپ و تعامل این دو با یکدیگر و در بخش دوم این مبحث می پردازیم به بررسی و نحوه استفاده از یک پلاگین بسیار کاربردی و ضروری دیگر با نام carousel (اسلایدر) و نحوه ایجاد اون رو توسط بوت استرپ بررسی خواهیم کرد
مطالب مطرح شده در این جلسه عبارتند از :
این مطلب یک جلسه از آموزش حرفه ای بوت استرپ می باشد و برای مشاهده آن باید در دوره ثبت نام کنید.
سلام استاد صالحی
استاد ببخشید من تو قسمت اسلایدر یه مشکلی دارم که اسلایدر داخل کروم به خوبی نمایش داده میشه اما تو فایرفاکس و اینترنت اکسپلورر حتی نسخه 11 یه باگ داره که ارتفاع عکس ها تو عوض شدن اسلاید ها زیاد میشه
اگه وقت میکنید یه نگاهی بهش بندازید مشکلم رو بهم بگید. ممنون
http://up.ashiyane.org/images/exskpjvgxnejcezdwf5z.rar
سلام درسته برای اینک این مورد رو رفع کنی در ویدئو اشاره کردم باید ارتفاع تصاویری که انتخاب میکنی با ارتفاعی که برای اسلایدر در نظر میگیری یکی باشه که توی تصاویر شما اینطور نیست سعی می کنم یه روض مناسب برای این کار در پروژه ها معرفی کنم فعلا به همین صورت که گفتم عمل کن
سلام. یه مشکل داخل اسلایدر بود که داخل فایرفاکس انیمیشن fade اجرا می شد اما داخل کروم نه، من کدهای CSS رو به این شکل نوشتم، مشکل کروم هم حل شد و داخل هر دو مرورگر درست انجام می شه، دوستان اگه مرورگر دیگه ای دارین تست کنید که درست کار می کنه یا نه.
این کلاس رو ” carousel-fade ” به بخش اصلی اسلایدرتون اضافه کنید.
*********************************************************************
کدهای CSS:
سلام خدمت استاد صالحی ، تشکر میکنم از آموزش های خیلی خوبتون . من تا جلسه 13 ، دو تا سوال برام پیش اومده :
1- چطور میشه اسلایدر بند انگشتی با استفاده از پلاگین پیش فرض بوت استرپ ایجاد کرد ، اگر منبع یا سایتی برای آموزش این مورد سراغ دارید معرفی کنید تا از اون استفاده کنم.
2- در وبسایت 90 در پاین سایت ، یک بخشی وجود دارد که با select option ها ی مرتبط با هم ایجاد شده که با انتخاب هر گزینه از لیست مطالب مربوط به آن گزینه نمایش داده میشود ، میخواستم بدونم این select option ها هم جزء امکانات بوت استرپ است و اگر منبعی سراغ دارید برای آموزش چنین موردی لطفا معرفی کنید. ممنون
سلام برای سوالتون موارد زیادی در وب هست عبارت thumbnail slider در گوگل جستجو کنید یه نمونه :
http://flexslider.woothemes.com/thumbnail-slider.html
برای سوال دومتون هم بله select option رو می تونید با بوت استرپ ایجاد کنید اما لود لیت مطالب مربوط به گزینه رو دیگه باید بصورت داینامیک مثلا توسط php و ajax پیاده سازی کنید
سلام آقای صالحی ، من یک سوال اول فروردین پرسیدم ، تا امروز که 14 فروردین هست هنوز پاسخ ندادید ، اگه جواب بدید ممنون میشم.
عذر خواهی می کنم سوالتون رو ندید بودم پاسختون داده شد موفق باشید
واقعا بوت استرپ و جی کوئری در بحث شخصی سازی فریمورک بهم وابسته اند
سلام و وقتتون بخیر
من وقتی از glyphicon ها استفاده می کنم بجای نشون دادن شکلشون، یک مربع خالی میندازه! بخاطر همین تا الان از fontawesome ها استفاده می کردم که خیلی هم خوب بودند. ولی تو درس اسلایدر، برای ایجاد اون فلش های روی اسلایدر، این آیکن ها در بالای تصویر و نه در وسط تصویر نمایش داده میشن!
سوال اول اینکه چه کنم بیان وسط؟
سوال دوم اینکه چرا glyphicon های من مربع توخالی ان؟ با چند تا مرورگر هم تست کردم.
متشکرم
سلام اگر glyphicon ها بصورت مربع نمایش داده میشن احتمالا فونت هاش رو در پروژه قرار ندادید و آدرس دهیتون هم اشتباهه
آیکون های اسلایدر رو متوجه منظورتون نشدم!
ممنون از پاسخ شما
فونت ها داخل پوشه font قرار دارن. لطفا برای آدرس دهی راهنمایی بفرمایید تا اینکه بفرمایید در کدام قسمت بوده است.
***منظورم این بود که در اسلایدر وقتی در Span مربوط به فلش های روی آن، از مثلا fa-chevron-right استفاده می کنم، میوفته قسمت بالایی عکس اسلایدر و نه در وسط عکس اسلایدر.
خواهش می کنم اگر ساختار html و کلاس ها رو درست رعایت کرده باشید نباید چنین حالتی پیش بیاد فابل های پروژتون رو برای بند ایمیل کنید تا بررسی کنم
چشم ایمیل می کنم. خیلی ممنونم
سلام جناب صالحی
من هم سوال آخر زینب سادات رو داشتم
خواهشمندم در پست قرار بدهید
سلام دوست عزیز این موارد بر می گرده به تسلط شما به css و جز مبحث بوت استرپ نیست در این دوره هم عرض کردیم پیش نیاز این دوره آشنایی مناسب با css هست
بله با css به راحتی میشه اینکار رو انجام داد
فکر میکردم در خود bootstrap کلاس خاصی براش تعبیه شده باشه
ممنون
سلام
از آموزش خوبتون خیلی ممنونم.
استاد عزیز من همه سوالاتمو خودم جوابشون رو پیدا کردم اما واقعا توی بخش اسلایدر درمونده شدم.
شما توی فیلم ها گفتین که برخی از دانشجوها گفتن که افکت اسلایدر(که همانند fade شدن هست) براشون عمل نکرده. دقیقا من هم همین مشکل رو دارم اما هر کاری کردم نتونستم درستش کنم. با اینکه دوره طراحی وبتون رو هم گذروندم اما نتونستم.
میشه لطفا بگین کجا رو باید درست کنیم؟
ممنون میشم جواب بدین
سلام خواهش می کنم اگر طبق آموزش پیش برید نباید مشکلی باشه