Click here for free DL of the app version that can save data.

No:42996

A game of designing starships for cruise lines.
Developer User19040｜Date and time 24/2/13 18:55:13
Build time 8.214 sec｜Game capacity 2.479KB｜

Script

Sure! Here's an example of a game that allows you to design starships for cruise lines using JavaScript in a single HTML file, enclosed in script tags:

Starship Designer - Cruise Lines Edition

Select Ship Components:

In this game, you can select different components (represented by pictograms) from the component container and double-click on the ship's container to add them to the ship. Each component has a specific image and data-component attribute to identify them. The selected component has a blue border. You can modify the game design and replace the existing pictograms (cabin.png, pool.png, restaurant.png, and spa.png) with your own according to your preferences. Please note that this is a simple example and you can expand upon it by adding more features, such as ship customization options, saving and loading ship designs, and so on.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

Click here for free DL of the app version that can save data.

Sure! Here's an example of a game that allows you to design starships for cruise lines using JavaScript in a single HTML file, enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Starship Designer - Cruise Lines Edition</title>
  <style>
    .selected { border: 3px solid blue; }
  </style>
</head>
<body>
  <h1>Starship Designer - Cruise Lines Edition</h1>
  
  <div id="shipContainer"></div>
  
  <h2>Select Ship Components:</h2>
  <div id="componentContainer">
    <img src="cabin.png" data-component="Cabin" class="component">
    <img src="pool.png" data-component="Pool" class="component">
    <img src="restaurant.png" data-component="Restaurant" class="component">
    <img src="spa.png" data-component="Spa" class="component">
  </div>
  
  <script>
    const shipContainer = document.getElementById("shipContainer");
    const componentImages = document.getElementsByClassName("component");
    
    let selectedComponent = null;
    
    // Add event listeners to each component image
    Array.from(componentImages).forEach(image => {
      image.addEventListener("click", function() {
        // Deselect previous component
        if (selectedComponent) {
          selectedComponent.classList.remove("selected");
        }
        
        // Select current component
        selectedComponent = this;
        this.classList.add("selected");
      });
      
      image.addEventListener("dblclick", function() {
        // Add selected component to the ship
        if (selectedComponent) {
          const component = document.createElement("div");
          component.innerHTML = selectedComponent.dataset.component;
          component.style.backgroundImage = `url("${selectedComponent.src}")`;
          shipContainer.appendChild(component);
        }
      });
    });
  </script>
</body>
</html>
```

Please note that this is a simple example and you can expand upon it by adding more features, such as ship customization options, saving and loading ship designs, and so on.