JavaScript Forum

**sksksk** · 04:18 PM

Update: Here's an example http://198-163-465.awardspace.co.uk/index.html

Well i recently got into jquery, ok i started learning it 2 days ago, but i feel as though i'm learning rather quickly - i suppose that's the beauty of jquery - anyway i have been trying to make my own slider type thing, so here's my jquery:

Code:

<script type="text/javascript">
    
    $(function() {
        $('.j_link') .click(function() {
            $('#box2') .animate({"right" : "316px"}, 1000);
            $('#box3') .animate({"right" : "316px"}, 1000);
            $('#box4') .animate({"right" : "316px"}, 1000);
            $('#box5') .animate({"right" : "316px"}, 1000);
            
            $('#box2') .animate({"right" : "316px"}, 1000);
            $('#box3') .animate({"right" : "316px"}, 1000);
            $('#box4') .animate({"right" : "316px"}, 1000);
            $('#box5') .animate({"right" : "316px"}, 1000);
        
            $('#box3') .animate({"right" : "632px"}, 1000);
            $('#box4') .animate({"right" : "632px"}, 1000);
            $('#box5') .animate({"right" : "632px"}, 1000);
            
            $('#box3') .animate({"right" : "632px"}, 1000);
            $('#box4') .animate({"right" : "632px"}, 1000);
            $('#box5') .animate({"right" : "632px"}, 1000);
            
            $('#box4') .animate({"right" : "948px"}, 1000);
            $('#box5') .animate({"right" : "948px"}, 1000);
            
            $('#box4') .animate({"right" : "948px"}, 1000);
            $('#box5') .animate({"right" : "948px"}, 1000);
            
            $('#box5') .animate({"right" : "1264px"}, 1000);
            
            $('#box5') .animate({"right" : "1264px"}, 1000);
        });
    });
    
    </script>

and here's my html:

Code:

<div id="container">

<div id="content">

<div id="box">

</div>

<div id="box2">

</div>

<div id="box3">

</div>

<div id="box4">

</div>

<div id="box5">

</div>

</div>    
</div>

<div id="link">
    <a class="j_link" href="#">Click Here</a>
</div>

i don't know why i called it j_link lol

and here's my css:

Code:

<style type="text/css">

    #container {
        position:absolute;
        width:340px;
        height:350px;
        display:;
        margin:2em;
        overflow:;
        position:relative;
        background:#;
    }

    #content {
        position:absolute;
        width:1800px;
        height:350px;
        display:;
        margin:2em;
        position:relative;
        background:#;
    }

    #box {
        float:left;
        width:300px;
        height:300px;
        display:;
        margin-left:0em;
        margin-bottom:2em;
        margin-right:1em;
        margin-top:0em;
        position:relative;
        background:#ff0000;
    }
    
    #box2 {
        float:left;
        width:300px;
        height:300px;
        display:;
        margin-left:0em;
        margin-bottom:2em;
        margin-right:1em;
        margin-top:0em;
        position:relative;
        background:#0000ff;
    }
    
    #box3 {

        float:left;
        width:300px;
        height:300px;
        display:;
        margin-left:0em;
        margin-bottom:2em;
        margin-right:1em;
        margin-top:0em;
        position:relative;
        background:#ff0000;
    }
    
    #box4 {

        float:left;
        width:300px;
        height:300px;
        display:;
        margin-left:0em;
        margin-bottom:2em;
        margin-right:1em;
        margin-top:0em;
        position:relative;
        background:#0000ff;
    }
    
    #box5 {

        float:left;
        width:300px;
        height:300px;
        display:;
        margin-left:0em;
        margin-bottom:2em;
        margin-right:1em;
        margin-top:0em;
        position:relative;
        background:#ff0000;
    }
    
    #link {
        width:100%;
        height:100px;
        background:#;
    }

    

    </style>

Remeber i only started using JQuery 2 days ago so be fair

All the code works, i was just wondering if there was a way to shoten it 'cause i seems a little long to me??