Issue using Multi-Item Carousel

Topic: Issue using Multi-Item Carousel

kennylajara priority asked 1 year ago

Expected behavior

See the multi-item carousel and be able to use it.

enter image description here

Actual behavior

See the images. No carousel functionality.

enter image description here

Resources (screenshots, code snippets etc.)

For the installation, I downloaded the Bootstrap 5 PRO, unzip it, moved the file into the assets directory of my project. and added the code snippets:

JS: vendor/mdb/7.1.0/js/mdb.umd.min.js
CSS: vendor/mdb/7.1.0/css/mdb.min.css

For the carousel, I am using the example code in the carousel: https://mdbootstrap.com/docs/standard/plugins/multi-item-carousel/#section-basic-example

Note: I am sure there is no conflict with other libraries because there is no other libraries other than the ones suggested (font awesome and roboto).

Add comment

Kamila Pieńkowska staff answered 1 year ago

0 0 Best answer

Multi-Item Carousel is a plugin so you have to import MDB files and Plugin code.

How did you link CSS and JS in your HTML?

kennylajara priority commented 1 year ago

I added the links as you will normally add any other CSS or JS file. The link tag for CSS and the script tag for JS. But I don't know how to import the plugins. I get an error stating that you can use import outside a module. Well... I am an old-fashioned backend developer who never paid attention to JS after the death of JQuery.

Kamila Pieńkowska staff commented 1 year ago

You can add another script tag with a path to the plugin file. An example of how to do that is in the index.html included in the package.

kennylajara priority commented 1 year ago

When I do that, I get an error stating that you can use import outside a module.

Kamila Pieńkowska staff commented 1 year ago

My answer probably wasn't clear enough.

I mean something like this:

  <!-- MDB ESSENTIAL -->
  <script type="text/javascript" src="js/mdb.umd.min.js"></script>
  <!-- MDB PLUGINS -->
  <script type="text/javascript" src="plugins/js/all.min.js"></script>

kennylajara priority commented 1 year ago

I don't have the plugins folder.

Kamila Pieńkowska staff commented 1 year ago

But you do have package Advanced?

Add comment

Write

Create snippet

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: Priority
Premium support: Yes
Technology: MDB Standard
MDB Version: MDB5 7.1.0
Device: PC
Browser: Chrome
OS: Windows
Provided sample code: Yes
Provided link: Yes

kennylajara

0Support score
3Questions 0Answers 0Snippets