چگونه عنصری اسکرول خور بسازیم بدون نمایش نوار اسکرول

سلام

شاید شما هم در برخی مواقع در جای خواسته باشید یک عنصر اسکرول خور در صفحه داشته باشید ولی نخواهید نوار اسکرول آن نشان داده شود.

راه حل :

۱- دیو پدر که طول و عرض آن را در اندازه نیاز ثابت است . که خواص نمایش ان مخفی میشود(اسکرول آن مخفی میشود).

۲-دیو بچه (زیرمجموعه دیو پدر) که می خواهیم محتوای آن اسکرول بخورد .

* چون تو متن کمی بد توضیح داده بود اینجا را از دانش خودم  مینویسم*

خاصیت overflow دیو پدر را  hiden میکنید سپس به دیو پدر عرضی کمتر از دیو بچه می دهید به قدری که نوار اسکرول طولی آن مخفی شود. در مورد ارتفاع هم همین طور . این کار را با مرورگر انجام دهید تا فقط بقدر نوار اسکرول عرض و ارتفاع دیو پدر را کم کنید بعد اعداد بدست آمده را از مرورگر به کد سی اس اس ببرید.

در دیو بچه هم خاصیت overflow را scroll قرار میدهیم تا محتوایش اسکرول بخورد.

نمونه کد :

.test{
width: 500px;
height:300px;
overflow: scroll;
	}
	
.main {
 width: 485px;
  height: 261px;;
overflow: hidden;
	}

کلاس test دیو بچه است و کلاس main دیو پدر است.

منبع : codeholic.in

ترجمه : امین فراست