WEBOS

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>仮想OS Pro</title>
  <style>
    body {
      margin: 0;
      background: #2c3e50;
      font-family: 'Segoe UI', sans-serif;
      overflow: hidden;
    }
    #desktop {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 40px;
      background: linear-gradient(#2980b9, #34495e);
    }
    .icon {
      width: 70px;
      text-align: center;
      margin: 20px;
      cursor: pointer;
      color: white;
    }
    .window {
      position: absolute;
      width: 300px;
      height: 200px;
      background: white;
      border: 2px solid #555;
      display: none;
      box-shadow: 4px 4px 10px rgba(0,0,0,0.5);
    }
    .window-header {
      background: #3498db;
      padding: 5px;
      cursor: move;
      color: white;
    }
    .window-body {
      padding: 10px;
    }
    #taskbar {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      height: 40px;
      background: #2c3e50;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 10px;
      color: white;
    }
  </style>
</head>
<body onload="playStartupSound(); updateClock(); setInterval(updateClock, 1000);">

  <div id="desktop">
    <div class="icon" onclick="openWindow('memo')">📝<br>メモ帳</div>
    <div class="icon" onclick="openWindow('calc')">🧮<br>電卓</div>
  </div>

  <div id="taskbar">
    <div>仮想OS Pro</div>
    <div id="clock"></div>
  </div>

  <!-- メモ帳 -->
  <div class="window" id="memo">
    <div class="window-header" onmousedown="dragWindow(event, this.parentElement)">メモ帳</div>
    <div class="window-body">
      <textarea style="width: 100%; height: 100px;">メモを入力してください</textarea>
    </div>
  </div>

  <!-- 電卓 -->
  <div class="window" id="calc">
    <div class="window-header" onmousedown="dragWindow(event, this.parentElement)">電卓</div>
    <div class="window-body">
      <input type="text" id="calcDisplay" style="width:100%; font-size: 1.2em;" />
      <button onclick="calculate()">計算</button>
    </div>
  </div>

  <!-- 起動音 -->
  <audio id="bootSound" src="https://upload.wikimedia.org/wikipedia/commons/2/2f/Windows_95_startup.ogg" preload="auto"></audio>

  <script>
    function openWindow(id) {
      document.getElementById(id).style.display = 'block';
    }

    function dragWindow(e, el) {
      e.preventDefault();
      let offsetX = e.clientX - el.offsetLeft;
      let offsetY = e.clientY - el.offsetTop;

      function move(e) {
        el.style.left = (e.clientX - offsetX) + 'px';
        el.style.top = (e.clientY - offsetY) + 'px';
      }

      function stop() {
        document.removeEventListener('mousemove', move);
        document.removeEventListener('mouseup', stop);
      }

      document.addEventListener('mousemove', move);
      document.addEventListener('mouseup', stop);
    }

    function calculate() {
      let result;
      try {
        result = eval(document.getElementById('calcDisplay').value);
      } catch {
        result = "エラー";
      }
      document.getElementById('calcDisplay').value = result;
    }

    function playStartupSound() {
      document.getElementById("bootSound").play();
    }

    function updateClock() {
      const now = new Date();
      const time = now.toLocaleTimeString();
      document.getElementById("clock").textContent = time;
    }
  </script>
</body>
</html>

投稿者: chosuke

趣味はゲームやアニメや漫画などです

「WEBOS」への23件のフィードバック

  1. After reading several posts back to back the consistent voice across them is impressive, and a stop at shadowglowcorner continued that voice consistency, sites that maintain a single coherent voice across many pieces by potentially many writers represent serious editorial discipline and this one has clearly developed the institutional consistency needed for that.

  2. Glad to find a site whose links lead somewhere worth going rather than back to itself for SEO juice, and a stop at silverpetalstore kept that generous outbound feel, citing other peoples work with real respect rather than just for ranking signals is a sign of an honest operation worth supporting going forward.

  3. Reading this triggered a small but real correction in something I had assumed, and a stop at silverpetalcollective extended that corrective effect, content that updates my beliefs through evidence rather than rhetoric is content with intellectual integrity and this site has earned that label consistently across the pieces I have read so far today.

  4. A piece that did not require external context to follow, and a look at velvetorchidmarket maintained the same self contained quality, content that stands alone without forcing readers to chase prerequisites is more accessible and this site has clearly thought about how each piece can serve a fresh visitor rather than only existing members.

  5. Saving this link for the next time someone asks me about this topic, and a look at urbanpickcorner expanded what I will be sharing with them, this is the kind of resource that makes a real difference when you are trying to point a friend to something useful and reliable rather than generic marketing pages.

  6. Will share this on a forum I am part of where it will be appreciated by others working in the same area, and a look at velvetorchidmarket suggests there is more here worth passing along too, definitely a generous resource that deserves a wider audience than it probably has today across the open internet.

  7. Liked that the post acknowledged complications rather than pretending they did not exist, and a stop at ambergrovecrafts continued that honest framing, sites that handle complexity with care rather than papering it over with simplifying claims are doing real intellectual work and this one is clearly in that category based on what I have read.

  8. Now adjusting my mental model of how the topic fits into the broader landscape, and a look at neonbuycorner extended that adjustment, content that affects my structural understanding rather than just my factual knowledge is content with deeper impact and this site is providing those structural updates at a meaningful rate consistently across topics.

  9. Started reading and ended an hour later without realising the time had passed, and a look at echopinecollective produced the same time dilation effect, when content makes time feel different the writer has achieved something well beyond the average and this site is producing that experience for me reliably across multiple readings.

  10. Glad I gave this fifteen minutes rather than the usual three minute skim, and a look at digitaldealcorner earned the same investment, time spent on quality content is rarely wasted but the reverse is also true and learning which sites deserve which kind of attention is part of being a careful online reader.

  11. Well done, the kind of post that makes you slow down and actually read instead of skimming for keywords, and a look at nextgentrendzone kept me reading carefully too, that is a sign of writing that has been crafted rather than churned out for an algorithm to see today and tomorrow.

  12. Now adding the writer to a small mental list of voices I want to follow, and a look at velvetcrestmarket reinforced that follow intention, the few writers whose work I actively track are writers who have demonstrated sustained quality and this writer has clearly demonstrated that sustained quality across the pieces I have sampled here today.

  13. Liked the way the post got out of its own way, and a stop at hyperdealhub extended that invisible craft, the best writing you barely notice while reading because it is doing its work without drawing attention to itself and this site has clearly mastered that disappearing act across the pieces I have read.

  14. Bookmark folder created specifically for this site, and a look at epiccartcenter confirmed the dedicated folder was the right call, dedicated folders for individual sites are a level of organisation I rarely deploy and this site has earned that level of dedicated tracking based on the consistency I have seen so far across sessions.

  15. Stayed longer than planned because each section earned the next, and a look at copperwindessentials kept that pulling effect going across more pages, the kind of subtle pull that good writing exerts on attention is something I find harder and harder to resist when I encounter it on the open web today.

  16. I learned more from this short post than from longer articles I read earlier today, and a stop at silversproutstore added even more useful detail without going off topic, this site clearly knows how to keep things focused without sacrificing depth which is a hard balance to strike for any writer.

  17. Top notch writing, every paragraph carries weight and nothing feels like filler, and a stop at neonpickmarket reflected that same care, a rare thing on the open web these days where most pages exist for clicks rather than actual reader value or anything close to that which is honestly a real shame.

  18. Reading this in a moment of low energy still kept my attention, and a stop at perfectbuycorner continued that engagement under suboptimal conditions, content that survives the reader being tired is content with extra reserves of pull and this site has the kind of writing that holds up even when I am not at my reading best.

  19. Going to share this with a friend who has been asking the same questions for a while now, and a stop at crystalbloommarket added a few more pages I will pass along too, this is the kind of generous information that earns a small thank you from me right now and again later this week.

  20. Now placing this in the same category as a few other sites I have come to trust, and a look at goodslinkstore continued the placement decision, the small category of fully trusted sites is one I extend rarely and only after multiple positive reading sessions and this site has earned the category placement methodically over time.

  21. Glad I gave this a chance instead of bouncing on the headline, and after frostharbormarket I was certain I had made the right call, snap judgements based on titles miss a lot of good content and this is a reminder to slow down and check things out before scrolling past in a hurry.

  22. Useful enough to recommend to several people I know who would appreciate it, and a stop at infinitydealcenter added more material I will pass along too, the kind of writing that earns word of mouth is the kind that actually delivers on its promises which is what this site does without any drama or fanfare attached.

  23. My friends would appreciate a few of these posts and I will be sending links accordingly, and a look at nextcartstation added more pages to my share queue, content that earns shares to specific people in specific contexts is content with social utility and this site is generating those targeted shares from me consistently lately.

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です