Tentando deixar galeria responsiva

[guirufino 0]

Então estou tentando deixa um galeria q achei na net responsiva, só que não intendo nada de javascript, acho que é aqui que esta o problema mais n tenho certeza.

segue código:

HTML:

<div id="games">

<!--Link para Imaguem-->
    <a href="noticia4.html">
<!--Aqui colocar a imaguem 900x500-->
    <img src="img/Imaguemsparadownload/NeedForSpeedPayback.png" width="900" height="500" alt="Need For Speed Payback" />
<!--Colocar o Texto!-->
        <span>
            <b><font face="Arial">Need For Speed Payback</font></b><br />
            <i>Saiu analize de Need For Speed Payback, clique e confira.</i>
        </span>
    </a>
</div>
 

<!--Aqui para configurar o tamanho e os efeitos Galeria-->
<script> $('#games').coinslider({ width : 900 , height: 500 , navigation : false , delay : 5000 , navigation: true , effect: 'rain' } ) ;  </script>

 

Entao nessa parte do script que começa a zuera.... se eu muda o "width:100%" ate funciona mais e como se ele n existi-se não consigo clikar na imagem, se eu colocar "height:100%" não funciona a imagem some....

 

vo coloca parte do codigo da galeira que eu acho que seja relevante:

Javascript:

 

(function($) {

    var params         = new Array;
    var order        = new Array;
    var images        = new Array;
    var links        = new Array;
    var linksTarget = new Array;
    var titles        = new Array;
    var interval    = new Array;
    var imagePos    = new Array;
    var appInterval = new Array;
    var squarePos    = new Array;
    var reverse        = new Array;

    $.fn.coinslider= $.fn.CoinSlider = function(options){

        init = function(el){

            order[el.id]         = new Array();    // order of square appereance
            images[el.id]        = new Array();
            links[el.id]        = new Array();
            linksTarget[el.id]    = new Array();
            titles[el.id]        = new Array();
            imagePos[el.id]        = 0;
            squarePos[el.id]    = 0;
            reverse[el.id]        = 1;

            params[el.id] = $.extend({}, $.fn.coinslider.defaults, options);

            // create images, links and titles arrays
            $.each($('#'+el.id+' img'), function(i,item){
                images[el.id]         = $(item).attr('src');
                links[el.id]         = $(item).parent().is('a') ? $(item).parent().attr('href') : '';
                linksTarget[el.id]     = $(item).parent().is('a') ? $(item).parent().attr('target') : '';
                titles[el.id]         = $(item).next().is('span') ? $(item).next().html() : '';
                $(item).hide();
                $(item).next().hide();
            });

            // set panel
            $(el).css({
                'background-image':'url('+images[el.id][0]+')',
                'width': params[el.id].width,
                'height': params[el.id].height,
                'position': 'relative',
                'background-position': 'top left'
            }).wrap("<div class='coin-slider' id='coin-slider-"+el.id+"' />");

            // create title bar
            $('#'+el.id).append("<div class='cs-title' id='cs-title-"+el.id+"' style='position: absolute; bottom:0; left: 0; z-index: 1000;'></div>");

            $.setFields(el);

            if(params[el.id].navigation)
                $.setNavigation(el);

            $.transition(el,0);
            $.transitionCall(el);

        }

        // squares positions
        $.setFields = function(el){

            tWidth = sWidth = parseInt(params[el.id].width/params[el.id].spw);
            tHeight = sHeight = parseInt(params[el.id].height/params[el.id].sph);

            counter = sLeft = sTop = 0;
            tgapx = gapx = params[el.id].width - params[el.id].spw*sWidth;
            tgapy = gapy = params[el.id].height - params[el.id].sph*sHeight;

            for(i=1;i <= params[el.id].sph;i++){
                gapx = tgapx;

                    if(gapy > 0){
                        gapy--;
                        sHeight = tHeight+1;
                    } else {
                        sHeight = tHeight;
                    }

                for(j=1; j <= params[el.id].spw; j++){

                    if(gapx > 0){
                        gapx--;
                        sWidth = tWidth+1;
                    } else {
                        sWidth = tWidth;
                    }

                    order[el.id][counter] = i+''+j;
                    counter++;

                    if(params[el.id].links)
                        $('#'+el.id).append("<a href='"+links[el.id][0]+"' class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></a>");
                    else
                        $('#'+el.id).append("<div class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></div>");

                    // positioning squares
                    $("#cs-"+el.id+i+j).css({
                        'background-position': -sLeft +'px '+(-sTop+'px'),
                        'left' : sLeft ,
                        'top': sTop
                    });

                    sLeft += sWidth;
                }

                sTop += sHeight;
                sLeft = 0;

            }

            $('.cs-'+el.id).mouseover(function(){
                $('#cs-navigation-'+el.id).show();
            });

            $('.cs-'+el.id).mouseout(function(){
                $('#cs-navigation-'+el.id).hide();
            });

            $('#cs-title-'+el.id).mouseover(function(){
                $('#cs-navigation-'+el.id).show();
            });

            $('#cs-title-'+el.id).mouseout(function(){
                $('#cs-navigation-'+el.id).hide();
            });

            if(params[el.id].hoverPause){
                $('.cs-'+el.id).mouseover(function(){
                    params[el.id].pause = true;
                });

                $('.cs-'+el.id).mouseout(function(){
                    params[el.id].pause = false;
                });

                $('#cs-title-'+el.id).mouseover(function(){
                    params[el.id].pause = true;
                });

                $('#cs-title-'+el.id).mouseout(function(){
                    params[el.id].pause = false;
                });
            }

        };