روش ریسپانسیو media@ و درصد

[modireserver]

سلام

دوستان میشه با روش @media تمامی قالب های ریسپانسیو کرد بدون بوت استرپ؟

[persiancoder]

سلام

دوستان میشه با روش @media تمامی قالب های ریسپانسیو کرد بدون بوت استرپ؟

بله. برای سایز های زیر باید استایل دهی کنید جهت فول ریسپانسیو شدن قالب.
mobile small , mobile medium , mobile large , tablet , desktop small , desktop large
که پهنای هرکدوم به ترتیب:
320,375,425,768,1024,1440
اگر خوب کد بدید خیلی تمیز از بوت استرپ هم در میاد.

[modireserver]

نمیدونم چرا از بوت استرپ خوشم نمیاد و بنظرم روش مدیا و درصد خیلی بهتره مهندس پس یعنی اگر خوب کد بشه از بوت استرپ میشه گفت کار تمیز تر درمیاد؟و اینکه برای این 6 سایز کد بشه دیگه برای سایز دیگه ای نیاز نیست؟

[my-host.site]

با سلام / کد نویسی بر اساس معیار نمایش صفحه در css خیلی ساده تر و کمی بهتر میشه گفت مبتدی تر از بوت استرپه . روز به روز رزولیشن های متفاوتی با ابعاد متغییر ارائه میشه شاید شما بر اساس mobile medium که همکار عزیزمون اشاره کردن پیچ خودتون رو طراحی کنید ولی رزولیشنی که برای اون قرار میدید 425 هست ! آیا تمامی رزولینش های medium میشه گفت 425 هستن؟ خیر پس در نتیجه بنده بوت استرپ رو پیشنهاد میدم

در کل صاحب نظر خودتونید این فقط یک پیشنهاد بود

[persiancoder]

نمیدونم چرا از بوت استرپ خوشم نمیاد و بنظرم روش مدیا و درصد خیلی بهتره مهندس پس یعنی اگر خوب کد بشه از بوت استرپ میشه گفت کار تمیز تر درمیاد؟و اینکه برای این 6 سایز کد بشه دیگه برای سایز دیگه ای نیاز نیست؟

بنده هم ترجیحم روی مدیا کوئری هست نسبت به بوت استرپ. ولی خب سلیقه ای هست.
ولی عمری داره مدیا کوئری... فرضا از این لحظه تا 2 سال آینده رزولیشن تقریبی دسکتاپ ها و لپ تاپ ها از 1360 پیکسل به بالا هست و در نتیجه پهنای مفید و مطمئن محتوا برای دسکتاپ 1200 یا 1150 پیکسل هست. بجز معدودی مانیتور های قدیمی که 1024 هستند و میشه با تبلت ها ادغامشون کرد. کلا از 768 تا 1023 رو روی حالت تبلت استایل بدید. از 1023 تا 1150 برای مانیتور های مربعی و کوچک استایل بدید ، بالای 1150 هم دیگه همون استایل عادی دسکتاپ هست. اینجا میمونه موبایل که سایز های متغیری دارن و ما اگر اسمارت فون ها مدنظرمون باشه از 320 پیکسل شروع میشه ، و تا 765 ( یک پیکسل کمتر از تبلت ) بصورت درصدی استایل بدید که روی همه موبایل ها صحیح نمایش داده بشه. ( منظورم این هست که پهنای مفید رو بصورت درصد ( مثلا 95% کل پهنا ) قرار بدید.

[p2m]

بنده هم ترجیحم روی مدیا کوئری هست نسبت به بوت استرپ. ولی خب سلیقه ای هست.
ولی عمری داره مدیا کوئری... فرضا از این لحظه تا 2 سال آینده رزولیشن تقریبی دسکتاپ ها و لپ تاپ ها از 1360 پیکسل به بالا هست و در نتیجه پهنای مفید و مطمئن محتوا برای دسکتاپ 1200 یا 1150 پیکسل هست. بجز معدودی مانیتور های قدیمی که 1024 هستند و میشه با تبلت ها ادغامشون کرد. کلا از 768 تا 1023 رو روی حالت تبلت استایل بدید. از 1023 تا 1150 برای مانیتور های مربعی و کوچک استایل بدید ، بالای 1150 هم دیگه همون استایل عادی دسکتاپ هست. اینجا میمونه موبایل که سایز های متغیری دارن و ما اگر اسمارت فون ها مدنظرمون باشه از 320 پیکسل شروع میشه ، و تا 765 ( یک پیکسل کمتر از تبلت ) بصورت درصدی استایل بدید که روی همه موبایل ها صحیح نمایش داده بشه. ( منظورم این هست که پهنای مفید رو بصورت درصد ( مثلا 95% کل پهنا ) قرار بدید.

ممنون بابت پاسخ خوبتون فقط مهندس یک سوال برای منوها چه کاری میشه با media کرد تو بوت استرپ حالت ایکون هستش برای مدیا چیکار کنیم که منوها به درستی نمایش داده بشن؟

[persiancoder]

ممنون بابت پاسخ خوبتون فقط مهندس یک سوال برای منوها چه کاری میشه با media کرد تو بوت استرپ حالت ایکون هستش برای مدیا چیکار کنیم که منوها به درستی نمایش داده بشن؟

برای منو موبایل یک div مجزا با استایل مخصوص موبایل بسازید. سپس این div رو در دسکتاپ مخفی کنید. و در حالت موبایل div اصلی منو رو مخفی کنید و این div رو نمایان کنید.
برای گذاشتن دکمه معروف toggle menu هم میتونید از javascript کمک بگیرید.

	$('#button').click(function(){		$('.mobilemenu').toggleClass('active');  	});