Problem with JavaScript slider carousel

Project Feedback
#1

-----slider carousel------

----page I’m trying to add it to…---------

First off… I know all of my images are broken, I have them saved locally. I have two questions about my code…First is very minor. When hovering the nav bar elements, the cursor turns to a pointer on all the elements except my search function…? Why is that?

Second, I am trying to insert a slider carousel with swiper.js. It works in it’s own file but when I tried to integrate it onto my landing page…the javascript isn’t functioning… please help!

#2

Where have you stored those files?

./resources/media/IMG_0406.jpeg
./resources/media/IMG_0418.jpeg

Where is this resources folder?

#3

Locally on my computer, I don’t have a hosting site yet. However I just removed the " ./ " (it was unnecessary)

#4

Why don’t you use GitHub for that?

#5

still learning :sweat_smile:

#6

Well, you have to make a repository, then upload the files and the copy the link of the files and use that instead of those values.

#7

Thank you, I will start using GitHub. Now…lets forget the pictures please as they are not my primary concern. Does anyone have any insight as to why my carousel will not load properly when merged with the landing page? As you can see the code works perfectly on its own, however when I try to merge it with my landing page it completely breaks and doesn’t implement the swiper js…

#8

Not sure if I did this correctly…

#9

Hello there,

I would try importing the Swiper script before your other js scripts.

Edit: If the Swiper script depends on jQuery, then jQuery should go first.
I forked your repo, and made the necessary changes: https://codesandbox.io/s/loving-pond-b4c5w?file=/index.html

Hope this helps

1 Like
#10

Seeing it work how I want it is exciting…however I tried to move it to my text-editor and it’s not working the way it works in your forked pen :cry: I don’t understand

#11

Unfortunately, it will be difficult to help without knowing exactly what your code is, and what your workspace structure is. Also, how are you trying to view it (Live Server)?

#12

Understandable, I am using VS and just trying to view it offline. I am currently in the process of uploading (and figuring out) it all to my GitHub account, it’s just my first time doing so.

#13

Thank you all for your help. As with learning anything new, silly mistakes will happen. Once I looked at it in my console, I was able to debug/fix the problems instantly. (files weren’t linked correctly, and some meta info in the head was all messed up)

1 Like
#14