<div id="slider"> <div id="carousel-bounding-box"> <div class="carousel slide" id="myCarousel"> <div class="carousel-inner"> <div class="active item" data-slide-number="0"> <img src="@Url.Content("~/Content/img/slides/flexslider/10.jpg")" alt="کیف کتی دو لت چرم طبیعی دست دوز" /> </div> <div class="item" data-slide-number="1"> <img src="@Url.Content("~/Content/img/slides/flexslider/20.jpg")" alt="کیف کتی دو لت چرم طبیعی دست دوز" /> </div> <div class="item" data-slide-number="2"> <img src="@Url.Content("~/Content/img/slides/flexslider/30.jpg")" alt="کیف جیبی مردانه چرم طبیعی دست دوز نواردوز شده" /> </div> </div> <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> </a> </div> </div> </div>
.carousel-control.left { background-image:none ; background-image:none; background-image:none; background-image:none; filter:none; /* background-repeat:repeat-x*/ } .carousel-control.right{right:0;left:auto;background-image:none; background-image:none; background-image:none; background-image:none; filter:none; } .hide-bullets { list-style:none; margin-left: 0px; margin:0; } .paddingzero{padding-right:0;padding-left:0} .thumbnail { padding: 0; } .carousel-inner>.item>img, .carousel-inner>.item>a>img { width: 100%; height:400px; }
سلام دوستان من از کد زیر برای اسلاید شو استفاده کردم. مشکلم روی گوشیهای موبایل هست که عکسها کشیده میشن.چون خودم height رو 400پیکسل گذاشتم.البته اگر height رو 100درصد هم بذارم روی دسکتاپ عکسها بهم میریزن ممنون میشم کمکم کنید؟
شما میبایست در media@ های مختلف ارتفاع اسلایدر را تنظیم کنید و بحث ریسپانسیو بودن صفحه را در css پیاده کنید ، یا مقدار ارتفاع را برابر auto قرار دهید تا نسبت به عرض به درستی تغییر کند.
ممنون من در media ها ارتفاع رو تنظیم میکنم اما کیفیت عکسها بهم میریزه و عکسها کشیده میشن اگر هم بر روی auto قرار بدم روی موبایل کوچیک نشون میده؟ کلا چکار کنم که افت کیفیت عکس نداشته باشن.ممنونم
برای حالت موبایل برای اینکه اسلایدر کوچک نباشد می توانید به عکس ارتفاع بدهید ولی عرض آن زیر باکس اصلی خودش قرار بگیرد با تنظیم overflow : hidden و بصورت کل تصویر حالت zoom بگیرد.
هیچ کاربری تا کنون از این پست تشکر نکرده است
با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)