filtering images with checkbox

filtering images with checkbox

Hello,

I'm looking for the next and can't solve it.

I have N pictures,

car red fast
car blue
car blue fast
car green slow
bike blue
bike green
...


  1. <?php

    echo "<html>";
    echo "<head>";
            echo '<script src="jquery-1.7.2.min.js" type="text/javascript"></script>';
            // JavaScript
            echo "
            <script language='JavaScript'>
                    function run()
                    {



                    };   
            </script>\n
            ";
    echo "</head>";
    echo "<body>";

    echo '<div id="cuerpo">';

            echo '<div id="menu_check">';

                    echo '<div id="bloque1">';
                            echo "Numero de ruedas<br>";
                            echo "  <a>Dos ruedas: </a> <input type=\"checkbox\" id=\"dos\" 
                                            onChange=\"run();\"> <br>";
                            echo "  <a>Tres ruedas: </a> <input type=\"checkbox\" id=\"tres\"
                                            onChange=\"run();\"> <br>";
                            echo "  <a>Cuatro ruedas: </a> <input type=\"checkbox\" id=\"cuatro\"
                                            onChange=\"run();\"> <br>";
                    echo "</div>";

                    echo '<div id="bloque2">';
































  2.                        echo "Numero de ruedas<br>";
                            echo "  <a>red: </a> <input type=\"checkbox\" id=\"red\" 
                                            onChange=\"run();\"> <br>";
                            echo "  <a>blue: </a> <input type=\"checkbox\" id=\"blue\"
                                            onChange=\"run();\"> <br>";
                            echo "  <a>green: </a> <input type=\"checkbox\" id=\"green\"
                                            onChange=\"run();\"> <br>";





  3. ....
  4. ....
  5.                 echo "</div>";
            echo "</div>";

            echo '<div id="cuerpo_i">';
    echo "menu izq<br>";
            echo "</div>";

            echo "<div id='cuerpo_d'>";
    echo "menu der<br>";

                    echo '<div class="imagen_portada" id="bici_azul_1.jpg">';
                            echo '<img src="imagen/bici_azul_1.jpg" />';
                    echo '</div>';
                    echo '<div class="imagen_portada" id="bici_blanca.jpg">';
                            echo '<img src="imagen/bici_blanca.jpg" />';
                    echo '</div>';
                    echo '<div class="imagen_portada" id="bici_negra_1.jpg">';
                            echo '<img src="imagen/bici_negra_1.jpg" />';
                    echo '</div>';
                    echo '<div class="imagen_portada" id="bici_negra_2.jpg">';
                            echo '<img src="imagen/bici_negra_2.jpg" />';
                    echo '</div>';
                    echo '<div class="imagen_portada" id="bici_roja.jpg">';
                            echo '<img src="imagen/bici_roja.jpg" />';
                    echo '</div>';
    ......
























  6. ......


  7.            echo "</div>";

  8. echo "</div>";

    echo "</body>";
    echo "</html>";
    ?>









I have some groups of checkboks, colour, number of wheels, pollution, ...

If I do some similar to

  1. echo '<div class="imagen_portada" id="amarillo dos poco">';
                            echo '<img src="imagen/moto_amarillo_1.png" />';
                    echo '</div>';




when I unckeck the "dos" checkbox, the image is hidde because match with the ID, but the problem is that "amarillo" and "poco" is checked, and tthe image may be hide when all of the characteristics is unchecked.

i try do it with a list,


  1.                                         <ul id=\"base\">
                                                    <li>two_wheels</li>
                                                    <li>bue</li>
                                                    <li>no_pollution</li>
                                            </ul>
                                            <ul id=\"temp\">




  2. (with jquery add or remove the checked / unchecked checkboxes
                                            </ul>





but I don't know if is the correct way, if exist a simple way to do it, ...



Can you help me?

Kind regards

Note: Sorry for my English