simple slider

Features of the Slider

Image Navigation:

Users can click on images to view them in the slider.

Navigation arrows (left and right) allow users to move between images.

Keyboard Support:

Users can navigate through images using keyboard keys (e.g., arrow keys).

Pressing the Enter key or Esc key closes the slider.

Click-Outside to Close:

Clicking outside the slider (e.g., on the overlay or background) closes the slider.

Responsive Design:

The slider is designed to work seamlessly across different screen sizes using Bootstrap.

Interactive UI:

Smooth transitions and animations enhance the user experience.

Techniques Used

HTML

CSS+BootStrap5

JavaScript (Vanilla JS)

Accessibility