PDA

View Full Version : سوال: مشکل در افقی کردن اسکرول در css



zeinab-es'haghi
پنج شنبه 23 شهریور 1391, 18:10 عصر
در این صفحه من می خوام اسکرول به جای عمودی،افقی باشه.
http://www.w3schools.com/cssref/tryit.asp?filename=trycss_overflow
کسی بلده چه جوری؟

khanlo.javid
پنج شنبه 23 شهریور 1391, 20:43 عصر
دوست عزیز مسلما هر چقدر عرض صفحه بره بالا تر اسکرول به صورت افقی در میاد حالا شما دقیقا بگید میخوایید چیکار کنید؟؟

zeinab-es'haghi
پنج شنبه 23 شهریور 1391, 21:01 عصر
توی اون مثال که توی صفحه هست رو گفتم ها ! الان اسکرولش عمودیه می خوام افقی بشه دقیقا! مشخصه دیگه

khanlo.javid
جمعه 24 شهریور 1391, 09:28 صبح
توی اون مثال که توی صفحه هست رو گفتم ها ! الان اسکرولش عمودیه می خوام افقی بشه دقیقا! مشخصه دیگه

دوست عزیز برای افقی کردن اسکرول باید از کد زیر استفاه کنی :


overflow-x: scroll; /*اسکرول افقی*/
overflow-y: hidden; /*حذف اسکرول عمودی */



موفق باشید.

zeinab-es'haghi
جمعه 24 شهریور 1391, 17:57 عصر
امتحان کردم نشد! تو اون لینک که دادم شما هم امتحان کنید،درست در نمیاد،یک اسکرول بار نشون میده اما اسکرول نمیشه!!!

meisam12
جمعه 24 شهریور 1391, 20:02 عصر
این سورس کد را امتحان کن . این کد را تست کردم درست بود.

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#lasteventimg {width:150px;overflow-x:scroll;overflow-y:hidden;}
ul {list-style:none; display:block;white-space:nowrap;}
li {width: 100px;display:inline;}

</style>
</head>

<body>
<div id="lasteventimg">
<ul>jkkdf jdfg ljkhfgl kjhdf kjdfh gkf lhlkdfghdfkgh kdlhdlf ghfdgjkhdf
<li><img src="./gfx/gallery/image1.jpg" /></li>
<li><img src="./gfx/gallery/image2.jpg" /></li>
<li><img src="./gfx/gallery/image3.jpg" /></li>
<li><img src="./gfx/gallery/image4.jpg" /></li>
<li><img src="./gfx/gallery/image5.jpg" /></li>
</ul>
</div>

</body>
</html>

zeinab-es'haghi
جمعه 24 شهریور 1391, 22:34 عصر
این سورس کد را امتحان کن . این کد را تست کردم درست بود.

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#lasteventimg {width:150px;overflow-x:scroll;overflow-y:hidden;}
ul {list-style:none; display:block;white-space:nowrap;}
li {width: 100px;display:inline;}

</style>
</head>

<body>
<div id="lasteventimg">
<ul>jkkdf jdfg ljkhfgl kjhdf kjdfh gkf lhlkdfghdfkgh kdlhdlf ghfdgjkhdf
<li><img src="./gfx/gallery/image1.jpg" /></li>
<li><img src="./gfx/gallery/image2.jpg" /></li>
<li><img src="./gfx/gallery/image3.jpg" /></li>
<li><img src="./gfx/gallery/image4.jpg" /></li>
<li><img src="./gfx/gallery/image5.jpg" /></li>
</ul>
</div>

</body>
</html>



بله درست شد. خیلی ممنون :)