Cześć, ściągnąłem skrypt do slidera z tej strony http://slidesjs.com/ i niestety nie mogę go zainstalować. Oto mój kod:

HTML
Kod
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">

  <link href="global.css" type="text/css" rel="stylesheet" />
  <title>start</title>
  <!-- dodanie jQuery do dokumentu -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js"></script>
    <script src="js/slides.min.jquery.js"></script>
    <script src="jQuery.js"></script>

<!-- Nasz kod java script: -->

<script type="text/javascript">
    $(document).ready(
            $('#slides').slides({
                preload: true,
                preloadImage: 'img/slider/loading.gif',
                container: 'slides_container',
                pagination: true,
                paginationClass: 'pagination',
                generateNextPrev: true,
                generatePagination: true,
                play: 5000,
                pause: 2500,
                hoverPause: true
            });
            )
</script>
</head>

<body>
<div id="container">
    
    <div id="header"></div>
    <div id="gardient"><img src="img/gradient.png"></img></div>
    <div id="content">
        <div id="menu">
            <div id="start_b"></div>
            <a class="galeria" href="#"></a>
                <div id="ukryte" style="display: none;">
                    <a class="webdesign"  href="webdesgin.htm"></a>
                    <a class="grafika"  href="grafika.htm"></a>
                </div>
            <a class="kontakt" href="kontakt.htm"></a>
        </div>
        
        
        
        <div id="example">
            <div id="slides">
                <div class="slides_container">
                    <a href="#" target="_blank"><img src="img/slider/slide1.png" width="558" height="256" alt="Slide 1"></a>
                    <a href="#" target="_blank"><img src="img/slider/slide2.png" width="558" height="256" alt="Slide 2"></a>
                    <a href="#" target="_blank"><img src="img/slider/slide3.png" width="558" height="256" alt="Slide 3"></a>
                    <a href="#" target="_blank"><img src="img/slider/slide4.png" width="558" height="256" alt="Slide 4"></a>
                </div>
                <a href="#" class="prev"><img src="img/slider/lstrz.png" width="26" height="110" alt="Arrow Prev"></a>
                <a href="#" class="next"><img src="img/slider/pstrz.png" width="26" height="110" alt="Arrow Next"></a>
            </div>
            <img src="img/slider/rama.png" width="560" height="260" alt="Example Frame" id="frame">
        </div>
        
        
    <div id="footer">

    </div>
    </div>

</div>
</body>
</html>



CSS
Kod
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abb
r,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike
,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption
,tbody,tfoot,thead,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
a:active { outline:none; }
body { line-height:1; color:black; background:white; }
ol,ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption,th,td { text-align:left; font-weight:normal; }
blockquote:before,blockquote:after,q:before,q:after { content:""; }
blockquote,q { quotes:"" ""; }

.clear {
  clear: both;
}

body{
overflow-x:hidden;
}

#container {
margin: 0 auto;
position:relative;
width:1366px;
position:absolute;
left:50%;
margin-left:-683px;
}

#header {
margin: 0 auto;
float:left;
  background: url('img/header.png') no-repeat;
  width: 1366px;
  height:160px;
}

#gradient {
float:left;
    margin: 0 auto;
}

#example {
    float:right;
    width:600px;
    height:350px;
    position:relative;
}

#content{
margin: 0 auto;
width:840px;
position:relative;
bottom:300px;
}

#frame {
    position:absolute;
    z-index:0;
    width:560px;
    height:260px;
    top:-3px;
    left:-1px;
}

#slides {
    position:absolute;
    top:-2px;
    z-index:100;
}

.slides_container {
    width:558px;
    overflow:hidden;
    position:relative;
    display:none;
}

.slides_container a {
    width:560px;
    height:260px;
    display:block;
}

.slides_container a img {
    display:block;
}

#slides .next,#slides .prev {
    position:absolute;
    top:107px;
    left:-39px;
    width:24px;
    height:43px;
    display:block;
    z-index:101;
}

#slides .next {
    left:585px;
}

/*
    Pagination
*/

.pagination {
    margin:26px auto 0;
    width:100px;
}

.pagination li {
    float:left;
    margin:0 1px;
    list-style:none;
}

.pagination li a {
    display:block;
    width:12px;
    height:0;
    padding-top:12px;
    background-image:url(../img/slider/pagination.png);
    background-position:0 0;
    float:left;
    overflow:hidden;
}

.pagination li.current a {
    background-position:0 -12px;
}

a:link,a:visited {
    color:#599100;
    text-decoration:none;
}

a:hover,a:active {
    color:#599100;
    text-decoration:underline;
}