Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Feb 2006
    Location
    California, USA
    Posts
    42
    Thanks
    4
    Thanked 1 Time in 1 Post

    Need help editing the display for a gallery function

    Hello,

    This is probably a simple fix, but I don't have much knowledge of JavaScript. Anyways, I'm trying to edit this code so there is no limit as to how many images should be displayed on each row. Thus, allowing the images to expand/contract as resolutions change. Any help is greatly appreciated!

    Code:
    var per_row = 7;
    var is_gallery = 0;
    var show_views = 1;
    var show_date = 0;
    var show_name = 0;
    var show_header = 1;
    var files = [];
    
    function addFile ( name, size, date, views, url, is_image, square, small )
    {
        files.push({'name': name, 'size': size, 'date': date, 'views': views, 'url': url, 'square_thumb_url': square, 'small_thumb_url': small, 'is_image': is_image});
    }
    
    function showGallery ( )
    {
        var html = '';
        var container = getObj ( 'view_contents' );
        if ( !container ) throw 'Could not find view_contents';
        var rows = Math.ceil ( files.length / per_row );
        html = '<div class="gallery">';
        for ( var row = 0; row < rows; ++row )
        {
            html += '<div class="row">';
            for ( var i = row * per_row; i < ( row + 1 ) * per_row && i < files.length; ++i )
            {
                file=files[i];
                file.thumb_url = file.is_image ? file.square_thumb_url : base_url +'templates/default2/images/nothumb.gif';
                html += '<div class="cell" style="width:110px;margin:0 0 10px 7px;">';
                    html += '<div class="inner_cell">';
                        html += '<div class="top">Views: ' + file.views + '</div>';
                        html += '<div class="center">';
                            html += '<a href="' + file.url + '"><img src="' + file.thumb_url + '" alt="' + file.name + '" class="img1 thumb" /></a>';
                        html += '</div>';
                        html += '<div class="bottom"><span class="name">' + file.name.wordWrap(15,'<br />',true) + '</span></div>';
                    html += '</div>';
                html += '</div>';
    
            }
            html += '<div class="spacer"></div></div>';
        }
        html += '</div><div class="spacer"></div>';
        container.innerHTML = html;
        setCookie( 'uploader_view_mode', 'gallery' )
    }
    Last edited by Clark05; 05-17-2009 at 12:02 AM.

  • #2
    New Coder
    Join Date
    Feb 2006
    Location
    California, USA
    Posts
    42
    Thanks
    4
    Thanked 1 Time in 1 Post
    Here is an example of the problem: http://www.imagegrounds.com/public/viewset/14 (use 800x600 resolution and you will see the rows are not even)

  • #3
    New Coder
    Join Date
    Feb 2006
    Location
    California, USA
    Posts
    42
    Thanks
    4
    Thanked 1 Time in 1 Post
    Resolved... Thanks Clark05! haha


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •