Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Thumbnails same height, please….

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #167862
    jess888
    Participant

    Trying to force this page to show the thumbnails at the same height. Thumbnail images vary in width.

    http://barbarawhiteperry.com/test.html

    Thanks again!

    #167869
    Paulie_D
    Member

    Firstly, you really need to abstract all that inline CSS to a CSS stylesheet.

    Then the basic styling would be like this

    http://codepen.io/Paulie-D/pen/hpsro/

    li {
      list-style: none;
      float:left;
      height:64px;
      display: block;
      border:1px solid grey;
      margin-right: 3px;
    }
    
    li a img {
    display: block;
    border: none;
    max-height:100%;
    }
    
    #167883
    jess888
    Participant

    Thank you SO much. That definitely helped.

    However, there is a function in one of the js. files that specifies the width as 65 – not sure how to adjust that…?

    #167884
    Paulie_D
    Member

    The width of what?

    Anyway, now that we’re into JS, I’ll push this over to the relevant section.

    #167885
    jess888
    Participant

    The width of the thumbnail, that is:

    _initCarousel = function() {

                // we are using the elastislide plugin:
                // http://tympanus.net/codrops/2011/09/12/elastislide-responsive-carousel/
                $esCarousel.show().elastislide({
                    imageW  : 60,
                    onClick : function( $item ) {
                        if( anim ) return false;
                        anim    = true;
                        // on click show image
                        _showImage($item);
                        // change current
                        current = $item.index();
                    }
    
Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.