carousel 相关问题

内容的旋转显示，可容纳各种内容，通常包括“下一个”和“前一个”按钮，以旋转内容。

我目前的轮播有问题。我的意思是它工作正常，但有一些奇怪的符号新用于更改幻灯片的按钮。我不知道如何解决这个问题。这是它的代码。我的轮播目前遇到问题。我的意思是它工作正常，但是有一些奇怪的符号新用于更改幻灯片的按钮。我不知道如何解决这个问题。这是它的代码。 <div class="well"> <div id="myCarousel" class="carousel slide"> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ol>  <div class="carousel-inner"> <div class="item active"> <div class="row-fluid"> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> </div> </div> <div class="item"> <div class="row-fluid"> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> </div> </div> <div class="item"> <div class="row-fluid"> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> <div class="span3"><a href="#x" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;" /></a></div> </div> </div> </div> <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a> <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> </div> </div>  <style type="text/css"> /* Removes the default 20px margin and creates some padding space for the indicators and controls */ .carousel { margin-bottom: 0; padding: 0 40px 30px 40px; } /* Reposition the controls slightly */ .carousel-control { left: -12px; } .carousel-control.right { right: -12px; } /* Changes the position of the indicators */ .carousel-indicators { right: 50%; top: auto; bottom: 0px; margin-right: -19px; } /* Changes the colour of the indicators */ .carousel-indicators li { background: #c0c0c0; } .carousel-indicators .active { background: #333333; } </style>  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#myCarousel').carousel({ interval: 10000 }) }); </script> 你能帮忙吗？谢谢！ <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a> <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a> 您的代码可能如下所示。您需要删除 a 标签之间的小箭头。 <a class="carousel-control left" href="#myCarousel" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span></a> <a class="carousel-control right" href="#myCarousel" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span></a> 尝试用图标替换它们。

html twitter-bootstrap carousel

回答 2 投票 0

React-bootstrap 轮播按钮定制

有什么问题。我有一个传送带和不能位于传送带内的按钮。我如何将它们与轮播连接？在 React-Bootstrap 网站上，他们建议使用 activeIndex，...

javascript reactjs slider carousel bootstrap-5

回答 1 投票 0

React Multi 轮播显示图像的全宽

我有 5 张图像想要在 React 多轮播中使用，但问题是我希望它们不要被剪切，如下图所示的轮播所示。我也想使用自定义图像...

reactjs carousel

回答 1 投票 0

更改 boostrap 上的轮播控件。太宽了。还有可怕的框架

可以帮我吗？我用卡片制作了一个旋转木马，但控件太大并且有“不太漂亮的边框”可以帮助我解决它？这是我的代码。丹克！可以帮我吗？我用卡片制作了一个旋转木马，但控件太大并且有“不太漂亮的边框”可以帮助我解决它？这是我的代码。丹克！ <button class="carousel-control-prev" type="button" data-target="#carouselExampleControls" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="visually-hidden">Previous</span> </button> <button class="carousel-control-next" type="button" data-target="#carouselExampleControls" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="visually-hidden">Next</span> </button> 我在按钮样式方面也遇到了类似的问题，只需将元素从更改为即可为我解决。 <a class="carousel-control-prev" style="align-self: flex-start;" type="button" data-target="#carouselExampleCaptions" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" type="button" data-target="#carouselExampleCaptions" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>

html css carousel

回答 1 投票 0

carouFredSel 淡入时中断

我使用 carouFredSel 插件构建了一个图像滑块，并且在单个图像轮播中一切正常，但当我继续构建我的网站时，我遇到了一些问题。第一次来...

javascript jquery slideshow carousel caroufredsel

回答 1 投票 0

如何将所有猫头鹰旋转木马项目设置为相等高度？

我正在研究猫头鹰旋转木马，当添加更多内容时，我希望所有项目具有相同的高度，项目高度不相等。我也尝试过使用 Flex 属性，但不明白为什么......

html css carousel owl-carousel

回答 4 投票 0

在Vue3-carousel中显示多个图像

我在网上广泛搜索答案，但没有结果。有好心人可以向我这个新手解释一下如何使用 Vue3-carousel 显示三个单独的图像吗？我看过...

javascript vue.js carousel vuejs3 vue3-carousel

回答 2 投票 0

引导程序中的轮播 - 覆盖整个div

我在引导程序中遇到轮播问题。我创建了两个 div - 左边一个带有文本，右边一个带有轮播。我希望轮播能够适应它的 div，尽管其中的图像大小。 ...

css bootstrap-4 carousel

回答 1 投票 0

为什么灯箱在轮播中使用时无法正确计算图像数量？

目标我想将 Splide 轮播与灯箱一起使用。问题如果我在 Splide 轮播中使用灯箱，则灯箱不会正确计算图像数量。比如说我有3个ima...

javascript html carousel fancybox splidejs

回答 1 投票 0

无限循环轮播幻灯片

更新：07/13 我找到了一种更好的方法来使用名为 cloneNode 的 JS 属性来计算无限滚动，并使用它来添加和附加克隆幻灯片以创建无限效果......

javascript html css carousel

回答 3 投票 0

IOS粉丝风格轮播

我正在使用 iCarousel 构建 IOS 应用程序（http://cocoacontrols.com/platforms/ios/controls/icarousel）我想改造旋转木马，让它看起来像一个“风扇”。所以，所有...

ios carousel

回答 1 投票 0

在 Vuetify 3 轮播中显示视频

我想知道我们可以使用视频而不是img作为vuetify3中的项目吗？我尝试过这个，但我认为它不会起作用：我想知道我们可以使用视频而不是img作为vuetify3中的项目吗？我尝试过这个，但我认为它不会起作用： <v-carousel hide-delimiters hide-delimiter-background show-arrows="hover" cycle> <v-carousel-item src="/img/test1.jpg"></v-carousel-item> <v-carousel-item v-bind:height="500" src="/img/testmovie.mp4"></v-carousel-item> </v-carousel> 这些视频和图片在我的公共文件夹中；该轮播显示图像，但不显示视频。 VCarouselItem 将 v-img 包装在 v-window-item 中（请参阅代码），因此它仅适用于图像。但是，您可以轻松地以类似的方式包装视频元素并将其放入轮播中： <v-carousel> <v-window-item class="v-carousel-item"> <video controls> ... </video> </v-window-item> ... 看看游乐场示例

video vuetify.js carousel nuxtjs3

回答 1 投票 0

引导轮播启动/停止功能

我在引导程序轮播中添加了一个播放/暂停按钮，但它似乎不起作用。我实现了我认为适合播放/暂停按钮的 JavaScript。我想要播放/暂停按钮...

javascript html twitter-bootstrap carousel

回答 1 投票 0

在Xamarin Android中，我们如何实现轮播视图？

我正在使用xamarin android。我必须显示一个水平滚动列表。由于我是 Xamarin Android 的初学者，我无法找到合适的解决方案。我还没找到合适的方法。

xamarin.android carousel

回答 2 投票 0

使用 CSS 网格流不同大小的块的轮播

有一个部分包含人们的感言。我希望它们位于 CSS 网格中，每个网格元素的大小基于其内容，并且所有元素都相互环绕。有没有这样的