You are browsing as a guest. Sign up (or log in) to start making projects!

My very own WebOS

By @tlevi

  • 3 Devlogs
  • 4 Total hours

This is my very own OS that can be run in the web!
Ship #1

@tlevi on My very own WebOS

My Submission for the WebOS mission. This project was built with HTML, CSS, and JavaScript that mimics a desktop operating system. It features interactive windows for different sections: links, search tool, notes app, and an embedded YouTube video player. You can close the tabs, move them around, or minimize them by clicking on the tab names in the top left corner. Enjoy!

Try project → See source code →
Open comments for this post

@tlevi on My very own WebOS

1h 29m 44s logged

Devlog 3 & Final:
The project is done! Improved draggable window system with better focus and z-index handling. Added 2 more windows with an extra functionality as stated in the guide. Finished the UI.

@tlevi

Devlog 3 & Final:
The project is done! Improved draggable window system with better focus and z-index handling. Added 2 more windows with an extra functionality as stated in the guide. Finished the UI.

Replying to @tlevi
0
36
Open comments for this post

@tlevi on My very own WebOS

1h 7m 39s logged

Following up on the desktop layout in WebOS, I’ve added real interactivity to my project. Windows are now fully draggable across the screen, and the red close buttons successfully close them. With three apps completely done, the core window management works. Next up, I’ll be making some more apps!

@tlevi

Following up on the desktop layout in WebOS, I’ve added real interactivity to my project. Windows are now fully draggable across the screen, and the red close buttons successfully close them. With three apps completely done, the core window management works. Next up, I’ll be making some more apps!

Replying to @tlevi
0
31
Open comments for this post

@tlevi on My very own WebOS

1h 33m 21s logged

Started the project today.
Got the basic structure down — a desktop div, a window div, and a title bar. Wrote my first bit of CSS to make it sit in the middle of the screen. Then the fun part: making it actually drag.
The first attempt sent the window flying off the screen immediately. Fixed that, and suddenly it was working.
One moveable window. That’s it. I will add more features!

@tlevi

Started the project today.
Got the basic structure down — a desktop div, a window div, and a title bar. Wrote my first bit of CSS to make it sit in the middle of the screen. Then the fun part: making it actually drag.
The first attempt sent the window flying off the screen immediately. Fixed that, and suddenly it was working.
One moveable window. That’s it. I will add more features!

Replying to @tlevi
0
52

Followers

Loading…