Web-OS Windows98 banner

Web-OS Windows98

2 devlogs
6h 24m 48s

This project simulates a Windows 98 desktop in the browser using HTML, CSS, and JavaScript. It includes a boot screen, desktop icons, a Start menu, and a taskbar with a clock.You can minimize, maximize, close. Overall, it’s a nostalgic, interactiv…

This project simulates a Windows 98 desktop in the browser using HTML, CSS, and JavaScript. It includes a boot screen, desktop icons, a Start menu, and a taskbar with a clock.You can minimize, maximize, close. Overall, it’s a nostalgic, interactive UI demo that mimics the classic Windows 98 experience—boot sequence, desktop, windows, taskbar, clock, and basic “apps”—all running entirely in the browser with no frameworks.

This project uses AI

It helped generate and refine the HTML/CSS/JavaScript, troubleshoot layout and icon issues, and suggest improvements for window behavior, styling, and UI details (like the taskbar clock and shortcut arrows).

Demo Repository

Loading README...

ACE

I focused on making the project feel more like a real Windows 98 boot experience, and on upgrading the UI so the Start menu matches the classic Win98 style.

Windows 98 Startup Scene + Sound
I added a proper “power on” flow instead of loading straight into the desktop. The project now begins with a Click to Start Windows 98 screen. This wasn’t just for looks—it’s also required because modern browsers block autoplay audio. Once the user clicks, the boot screen appears, the loading bar starts, and the startup sound plays at the right moment, just like the original Windows 98 vibe. After the boot finishes, it smoothly transitions into the desktop.

Start Menu (Win98 Style)
After the boot sequence was working, I replaced the basic Start menu with a more authentic Windows 98 layout. The menu now uses a left-side “Windows 98” vertical sidebar, proper spacing, hover highlight behavior, and the classic arrow indicators for menu items that would normally open submenus. This made the interface instantly feel more accurate and recognizable.

Notes / Fixes Along the Way
While adding these features, I also cleaned up some initialization issues (like duplicate event handlers) to ensure the desktop loads once, the Start button responds correctly, and the UI stays stable after the boot animation.

Next, I’ll keep improving the apps so the windows don’t just look correct, but also behave like the real Win98 programs.

0
ACE

Today I focused on getting the core “Windows 98 desktop” experience working smoothly inside the browser. The goal was to make the project instantly recognizable the moment it loads, with the classic wallpaper, icon layout, and the iconic taskbar at the bottom.

Desktop & Icon Layout
I finished setting up the desktop background (clouds wallpaper) and arranged the main desktop icons in a clean left-side column, similar to the original Windows 98 layout. Each icon has its own image and label styling, and I adjusted the label size so the app names look smaller and closer to the authentic Win98 desktop text.

You can see the main shortcuts showing correctly now:

My Computer
Paint
Calculator
Notepad
Shortcut Arrow Overlay
A big part of making it feel real was adding the shortcut arrow overlay. I implemented it so only certain apps display the shortcut arrow (instead of every icon), matching the behavior of Windows. This also required careful CSS positioning to ensure the arrow stays at the lower-left of the icon.

At this stage, the project successfully reproduces the visual layout of a Windows 98 desktop in the browser, including the icon set and taskbar. The next focus will be improving app functionality (like giving Paint, Explorer, and others real content), plus polishing interactions like window focus behavior and smoother UI transitions.

Attachment
0