PHP和Bootstrap中的多项轮播
PHP和Bootstrap中的多项轮播
提问于 2019-07-09 21:42:37
我有一个电子商务网站，并试图在产品页面底部的旋转木马中添加相关产品：
我查询我的数据库以获取相关产品，然后创建一个简单的Bootstrap carousel。
但是，我希望每张幻灯片上有多个项目，但项目的数量可能会根据屏幕大小而变化。
每个carousel项都有固定的宽度和高度：
.carousel-item{
width:300px;
height:400px;
border:1px solid var(--grey3);
}我尝试使用Bootstrap (如这里所示的https://www.youtube.com/watch?v=SAyLQVR1t5s)将我的旋转木马项目拆分成列，但我需要它们具有特定的大小来容纳产品信息，所以当我调整屏幕大小时，在旋转木马项目中使用灵活的列来容纳每个产品将不起作用。
我的PHP代码如下：
$related .= '<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">';
$related .= '<div class="carousel-inner">';
$i = 0;
$params = [$product_name,$product_name,$_SESSION['locale']['product_set']];
$sql = "SELECT * FROM products WHERE MATCH(product_name) AGAINST(?) AND product_name!=? AND product_set=? LIMIT 15";
$stmt = DB::run($sql,$params);
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){
$related_product_id = $row["id"];
$related_product_name = $row["product_name"];
$related .= '<div class="carousel-item';
if($i==0){$related .= ' active';}
$related .= '">';
$related .= '//product_info';
$related .= '</div>';
$i++;
}
$related .= '</div>';
$related .= '<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">';
$related .= '‹';
$related .= '</a>';
$related .= '<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">';
$related .= '›';
$related .= '</a>';
$related .= '</div>';回答 1
Stack Overflow用户
回答已采纳
发布于 2019-07-31 16:57:29
为了便于将来参考，我不再使用Bootstrap，而是按照建议使用https://kenwheeler.github.io/slick/，这样就容易多了
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56953996
复制相关文章
相似问题
腾讯云开发者
