Questions tagged [bootstrap-carousel]

A slideshow component for cycling through elements, like a carousel. Nested carousels are not supported.

272 questions
0
votes
1 answer

Change opacity in Bootstrap carousel with image indicator

I am making an HTML page that contains a Bootstrap carousel. I replaced the selector with the image. Then, by clicking the image, the slider will also change. I wanted to make the image selector opacity change according to the content in the slider…
g ky
  • 3
  • 3
0
votes
0 answers

How to change css style of the class inline

I use bootstrap slider on a page. I want to use Left and Right buttons only to scroll the images, but standard bootstrap slider uses a wide clickable areas from the left and the right of the slider and this areas overlap the slider. How can I get…
vitaliy4us
  • 483
  • 5
  • 21
0
votes
1 answer

How to create carousel items with splice based on item count using React-Bootstrap

I am trying to do splice, so that each page (Active & Other items) displays 3 items. But this is not working. Can someone help here please? Below is the code: var Cards1= filter.splice(0, Math.ceil(filter.length / 3)).map( item => { return ( …
mary
  • 57
  • 9
0
votes
1 answer

Bootstrap 4 carousel adding items in a loop from jQuery not working

I've few images which I'm trying to add in a loop to the bootstrap 4 carousel. I tried with the below code which doesn't seem to work. However if I add the same items manually (with the same HTML snippet from jQuery) for all items, it's…
RatDon
  • 3,403
  • 8
  • 43
  • 85
0
votes
1 answer

image in angular/bootstrap carousel doesn't center

I've been trying to get the images to center on the page. I tried justifying the content in the center and also aligning items in the center but neither works. Neither does margin auto (which usually does work). I tried setting similar stylings for…
st123
  • 246
  • 3
  • 14
0
votes
0 answers

image within link wont center align

I have a bootstrap carousel in my angular app. I added on a tags to the images so that when someone clicks an image it redirects to a particular page. I can't get the image to align to the center of the window (except if I alter the padding, which…
st123
  • 246
  • 3
  • 14
0
votes
1 answer

Carousel not working in Angular 10: images do not slide

I've been trying to implement a bootstrap carousel in my angular web page. I got the source code from the bootstrap site, so I believe everything is set up right... However, the carousel never actually slides. Also, when I click on the controls…
0
votes
1 answer

bootstrap carousel not aligning items correctly

I am relatively new to css and bootstrap and I'm trying to implement a carousel into my angular web app. I copied the source code from the bootstrap site but am having a lot of difficulties aligning everything correctly. Also the image slides don't…
0
votes
0 answers

Bootstrap Carousal in React Component : not working

I am using 'create-react-app' to develop e web application. I am using Context API to get the data to this component, named Carousal.js From the bootstrap for React, but my images are not showing up in the carousal. I tried testing if the image is…
Sal
  • 87
  • 6
0
votes
2 answers

React Bootstrap Carousel scroll top when slide

I'm trying to figure out how to make my Reactstrap carousel scroll up when I slide to the next or previous item. This is exactly how I need it to work Bootstrap Carousel scroll top when slide But I did things in another way using reactstrap node…
0
votes
3 answers

Why aren't my Bootstrap Controls working?

I'm trying to make a bootstrap carousel that contains 3 items at a time and has controls to switch to the next item. I created this carousel which does display the three items, the only problem is the controls aren't working when clicked, not quite…
0
votes
2 answers

Bootstrap Cards same width

I want my cards to cover the equal width of the screen, but my code below is as per content. Tried card-deck, but it didn't helped.
0
votes
1 answer

Use bootstrap's CSS for single react-bootstrap component rather than across the whole project

I'm working on a project that's using the Carousel from react-bootstrap. This only works if I import "bootstrap/dist/css/bootstrap.min.css"; in the app. The issue is that doing so changes the CSS for the entire app, which has lots of existing UI…
user43712
  • 147
  • 1
  • 2
  • 9
0
votes
0 answers

Bootstrap 4 carousel not working because of jQuery

I'm taking a Bootstrap 4 course and the task I'm required to do uses jQuery to create pause and play buttons in a carousel. While doing it in my computer, I use node modules to import jQuery, popper.js and Bootstrap JavaScript, but I also want to…
0
votes
1 answer

jQuery hide/show are only instantaneous, how can I make them transition with my carousel?

I'm pretty new to code and programming, but I'm playing around to learn some tools for web development. I've tried to make a bootstrap carousel trigger a change in text beside it and succeeded (see code below). But I also want it to have the same…
André Krosby
  • 1,008
  • 7
  • 18