基于%的HTML图像?

I want to create an HTML page which has the following:

There are 10 slots for image and there are 3 images, any one of the three image has 50% chance so it will acquire 50% (5 slots) and the rest two will take the left over 5 slots.

Is there any way to do this in js/php?

Any help would be appreciated!

Here's a snippet in PHP that probably helps you find a solution.

<?php
    $images = array(
        array( 'title' => 'mytitle1', 'path' => 'path/to/image1.png', 'slots' => 0 ),
        array( 'title' => 'mytitle2', 'path' => 'path/to/image2.png', 'slots' => 0 ),
        array( 'title' => 'mytitle3', 'path' => 'path/to/image3.png', 'slots' => 0 ),
    //  array( 'title' => 'mytitle4', 'path' => 'path/to/image4.png', 'slots' => 0 ),
    //  array( 'title' => 'mytitle5', 'path' => 'path/to/image5.png', 'slots' => 0 ),
    //  array( 'title' => 'mytitle6', 'path' => 'path/to/image6.png', 'slots' => 0 ),
    //  array( 'title' => 'mytitle7', 'path' => 'path/to/image7.png', 'slots' => 0 ),
    //  array( 'title' => 'mytitle8', 'path' => 'path/to/image8.png', 'slots' => 0 ),
    );

    // Calculate # of slots to use per image
    $nimages = count($images);                  // # of images
    $nslots  = 10;                              // # of slots
    $rimags = $nimages - 1;                     // # remaining images
    $images[0]['slots'] = floor($nslots * 0.5); // # slots 1st image
    $rslots = $nslots - $images[0]['slots'];    // # remaining slots
    $xslots  = floor($rslots / $rimags);        // slots / image
    $xtra    = ($rslots % $rimags);             // extra slots

    for ($xi=1; $xi<$nimages; $xi++) {
        $images[$xi]['slots'] = $xslots + (($xtra>0) ? 1 : 0);
        if ($xtra>0) $xtra--;
    }

    // Generate HTML code
    echo '<div id="image_panel">' . PHP_EOL;
    $nslot = 1;
    foreach ($images as $img) {
        if ($img['slots']<1) continue;
        for ($xi=0; $xi<$img['slots']; $xi++) {
           echo '  '.$nslot.': <img src="'.$img['path'].'"     title="'.$img['title'].'" alt="'.$img['title'].'" id="'.$xi.'" />' . PHP_EOL;
           $nslot++;
        }
    }
    echo '</div>' . PHP_EOL;
?>