Eternal Whispers

悪夢の旅: Nightmare Journey

A fully immersive horror-themed web page that combines storytelling with dynamic visual and interactive elements. This project is designed to give users a unique and eerie experience as they scroll through a haunting story.

Table of Contents

• Introduction
• Features
• Installation
• Usage
• Customization
• Contributing
• License
• Introduction
  

Nightmare Journey

It is a visually captivating web experience that tells the story of an artist named Yuki who encounters a malevolent spirit in a cursed forest. The site uses a combination of HTML, CSS, and JavaScript to create an eerie, interactive user experience. As the user scrolls, they reveal new chapters of the story, accompanied by dynamic images, glitch effects, and spooky transitions.

Features

• Dynamic Storytelling: Text and images transition smoothly into view as the user scrolls.
• Ghostly Effects: Ghost and glitch effects are triggered at specific points to enhance the horror atmosphere.
• Blood Overlay: A red-tinted blood overlay briefly flashes for a jump-scare effect.
• Progress Bar: Displays how far the user has progressed through the story.
• Auto-Scroll Option: Enables automatic scrolling for a hands-free, cinematic experience.
• Responsive Design: The layout adapts for mobile and desktop screen sizes.

Installation

1. Clone the Repository:

    git clone https://github.com/divyat2605.git

2. View the WebPage:

   https://eternal-whispers.netlify.app/
   

Usage

1. Simply open the index.html file in your favorite browser.
2. Scroll through the page to read the story, or activate the auto-scroll feature for a hands-free experience.
3. Interact with the page by scrolling to reveal dynamic content and experience the triggered ghost and glitch effects.

Auto-Scroll

• At the bottom left corner, you’ll find a checkbox labeled Auto-scroll. When selected, the page will scroll automatically, looping back to the top once it reaches the bottom.

Customization

You can easily modify the content, images, and styles of the webpage:

• Story Content: Replace the text in the

  tags within the HTML file to change the story.

• Images: Update the images in the .image-container section by replacing the src attributes with new image file paths.
• Effects: Modify the JavaScript to customize the ghost and glitch effects, or add new interactive features.

Contributing

If you’d like to contribute to the project, feel free to fork the repository and submit a pull request. Here’s how you can do that:

1. Fork the project.
2. Create a new branch (git checkout -b feature/new-feature).
3. Commit your changes (git commit -m 'Add some feature').
4. Push to the branch (git push origin feature/new-feature).
5. Open a pull request.