使用jQuery加载第一个图像后加载所有图像

Question

我一次为jQuery轮播加载5个图像，但是我只想加载第一个，另外4个加载1个图像后，我怎么能用jQuery做这个。

我正在应用以下css，因为图像适合每种分辨率。

代码如下我还在头部使用了jQuery.1.4.1.min.js.

<div align="center" id="conatier">
    <img src="/Images/home/Movie_Color_1.jpg" class="bg" style="display: block" id="img1">
    <img src="/Images/home/Movie_Color_2.jpg" class="bg" id="img2">
    <img src="/Images/home/Movie_Color_3.jpg" class="bg" id="img3">
    <img src="/Images/home/Movie_Color_4.jpg" class="bg" id="img4">
    <img src="/Images/home/Movie_Color_5.jpg" class="bg" id="img5">
</div>

<a onclick="fun_next()" style="margin:100px">Next</a> <a onclick="fun_pre()">Previous</a>

<script>
    var val = "";
    function fun_next() {
        commm();
        if (val == 4) { $("#img4").hide(); $("#img1").show(); }
        if (val == 3) { $("#img3").hide(); $("#img4").show(); }
        if (val == 2) { $("#img2").hide(); $("#img3").show(); }
        if (val == 1) { $("#img1").hide(); $("#img2").show(); }
    }

    function fun_pre() {
        commm();
        if (val == 4) { $("#img4").hide(); $("#img3").show(); }
        if (val == 3) { $("#img3").hide(); $("#img2").show(); }
        if (val == 2) { $("#img2").hide(); $("#img1").show(); }
        if (val == 1) { $("#img1").hide(); $("#img4").show(); }
    }

    function commm() {
        if ($("#img1").is(':hidden') == false) { val = 1; }
        if ($("#img2").is(':hidden') == false) { val = 2; }
        if ($("#img3").is(':hidden') == false) { val = 3; }
        if ($("#img4").is(':hidden') == false) { val = 4; } 
    }
</script>

//头部样式

<style type="text/css">
    .bg
    {
        width: 100%;
        height: 90%;
        position: absolute;
        top: 0;
        left: 0;
        display: none;            
    }

    a
    {            
        z-index: 1000;
        position: absolute;
        color: White;
        margin:50px;
    }
</style>