1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: MDB Carousel > Autoplay not intializing

surface2air free asked 9 years ago

Hi MDB Support, I really like your site, by the way, and I'm learning a lot about MDB and have integrated it with a few recent projects. I am working on a basic 5 slide (cover image) carousel using MDB, but I am not getting the carousel to auto play. I am referring to the demo found here: http://mdbootstrap.com/full-page-carousel/ And on the site I found a reference to the following script to initialize the auto play, but it doesn't kick in for the carousel slider: <script> $('.carousel').carousel(); </script> I was using it at the bottom, but I have also tried renaming the class reference from ('.carousel') to my ID ('#carousel1') but that didn't work either. Much appreciate your help on this! Thanks in advance, Eric eztiki@hotmail.com Seattle, Washington

neo pro answered 8 years ago

how do we delete these guys who are wasting our time and trying to advertise their company instead of answering the question...we have Jeiarty and Adriaty advertising something that has nothing to do with the question

Dawid Adach pro commented 8 years ago

Already removed

neo pro answered 8 years ago

hi surface2air, did you ever get this to work?

surface2air free answered 9 years ago

Hi Ilia, Yes, thanks for catching these missing resources! I have added them yesterday to my project, which I am staring at a lot of code, so I greatly appreciate having another set of eyes on this. However, the Carousel on the home page does not initialize - even with the missing mdb.js file resourced now in the project. It also does not play on mobile displays, but it will on larger displays once the controls have been clicked. Is there something else I might be missing? It seems like I have it all here. Thanks, Eric Seattle, Washington

neo pro commented 8 years ago

does anyone have the answer for this? this question was from a year ago and today on this day this exact same issue is what i'm having to deal with

Ilia Shneiderman free answered 9 years ago

Hi Eric! As I see from my PC, first Main bug on your page is: Failed to load resource: the server responded with a status of 404 (Not Found) witn js/mdb.js After then: Uncaught ReferenceError: $ is not defined (probably mismatch version of JQuery and missing mdb.js) WBW Illia

surface2air free answered 9 years ago

Hi Ilia, Thanks, yes, I have applied the following script with the unique ID ('#carousel1') for the carousel, but the carousel does not play until the controls are clicked:
<script> $('#carousel1').carousel({ interval: 5000, pause: “false” }) </script>
This script appears at page bottom. On mobile displays, the carousel does not play. Here's my project in production page: http://gridinteractive.com/gma/index.htm Thanks! Eric Seattle, Washington

Ilia Shneiderman free answered 9 years ago

Hi Surface2air! Let me show you that in your script try: $('#carousel1').carousel(... and put down of page the script

surface2air free answered 9 years ago

Hi jmona789, I cannot seem to get the Carousel to initialize autoplay. It also appears that I have a secondary issue with the Carousel as it appears in mobile displays: the Carousel does not play at all. :( Can I share my project? It's in production here: http://gridinteractive.com/gma/index.htm The Carousel is at the top of the page with 5 slides. There are no other Carousels used here except here at top. Thanks, Eric Seattle, Washington

jmona789 free answered 9 years ago

I have found it works if you add an interval of how often you want the slide to change(in ms). for example if you want them to change every five seconds you would use this: $('.carousel').carousel({ interval: 5000 }) Also the carousel will pause when you hover the mouse over it. If you want to prevent that you can do $('.carousel').carousel({ interval: 5000, pause: "false" })
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • ForumUser: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
carousel-slider-jquery-javascript
About author
surface2air
47Support score
20Questions 12Answers 0Snippets