JS代碼，多張圖片的漸層。可展開，可縮小。

<head>
    <title></title>
    <style type="text/css">
    .imgclass
    {
        width:200px; height:200px;
        }
        table tr td
        {
            width:300px; height:300px;
            }
    </style>
    <script src="jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#Button1').click(function () {
                //擷取的是所有類型(tagname)為img的元素
                //$('img').hide(3000);
                //$('img').show(3000);

                //擷取的是所有class屬性的值為“imgclass”的元素
                $('.imgclass').hide(3000);
                $('.imgclass').show(3000);
            })
        })
    </script>
</head>
<body>
    <table>
        <tr>
            <td>
                <img id="img1" src="images/1.jpg" class="imgclass" />
            </td>
            <td>
                <img id="img2" src="images/2.jpg" class="imgclass" />
            </td>
        </tr>
        <tr>
            <td>
                <img id="img3" src="images/3.jpg" class="imgclass" />
            </td>
            <td>
                <img id="img4" src="images/4.jpg" class="imgclass" />
            </td>
        </tr>
    </table>
    <input id="Button1" type="button" value="玩兒" /><br />
 
</body>