Skip to content

Conversation

Meetpidev
Copy link
Contributor

Image Slider Functionality Overview
This JavaScript code creates an interactive image slider that allows users to navigate through a series of images by clicking and dragging or swiping on touch devices.

👨‍💻 Changes proposed and Brief Description

Key Features
(1) Mouse and Touch Support:
The slider supports both mouse events (for desktop users) and touch events (for mobile users), ensuring a seamless experience across different devices.

(2) Dynamic Image Positioning:
Users can click and drag (or swipe) to move through the images, with the slider responding in real-time to their input. The images shift horizontally based on the user's movements

(3) Smooth Animations:
The slider employs CSS animations to create smooth transitions as images move into view. This enhances the visual appeal and user engagement

(4) Percentage-Based Movement:
The movement of the images is calculated as a percentage of the total width of the window, allowing for responsive behavior regardless of screen size.

(5) Constrained Navigation:
The code ensures that users cannot scroll beyond the first or last image, maintaining a controlled navigation experience.

  • ✅ My code doesn't break any part of the project
  • ✅ This PR does not contain plagiarized content.
  • ✅ My Addition/Changes works properly and matches the overall repo pattern.
  • ✅ The title of my pull request is a short description of the requested changes.

📷 Screenshots
image

Image Slider Functionality Overview This JavaScript code creates an interactive image slider that allows users to navigate through a series of images by clicking and dragging or swiping on touch devices.
Copy link

netlify bot commented Oct 6, 2024

Deploy Preview for 30daysofjs ready!

Name Link
🔨 Latest commit d70202a
🔍 Latest deploy log https://app.netlify.com/sites/30daysofjs/deploys/6702143e4deffb00082c83c1
😎 Deploy Preview https://deploy-preview-1921--30daysofjs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@Meetpidev
Copy link
Contributor Author

Meetpidev commented Oct 6, 2024

@swapnilsparsh Please Review This PR.. Requested to check the project in Live Server. i created really amazing Animations in slider.

Add Button for Topological Sort and Heap Sort
Added Logic To perform Topological Sort and Heap Sort.
@Meetpidev
Copy link
Contributor Author

@swapnilsparsh I have added two more sorting algo. in the project of sorting-visualizer. Added Topological sort algorithm and Heap sort algorithm. Please Review it.

@Meetpidev
Copy link
Contributor Author

@swapnilsparsh I have added two more sorting algo. in the project of sorting-visualizer. Added Topological sort algorithm and Heap sort algorithm. Please Review it.

@swapnilsparsh
Copy link
Owner

This type of project is already there in repo.

@Meetpidev
Copy link
Contributor Author

@swapnilsparsh I know but in that project there is no visual formatting for Topological sort and Heap sort.. i implemented that two sort in the same project. just added two more sorting algorithm.and updated that project. that is what i want to say..

@swapnilsparsh
Copy link
Owner

@swapnilsparsh I know but in that project there is no visual formatting for Topological sort and Heap sort.. i implemented that two sort in the same project. just added two more sorting algorithm.and updated that project. that is what i want to say..

That's great but try to make complex projects which are not present in our repo.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
2 participants