Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

Having Trouble Changing Size of Expandable Image Thumbnails

Options
  • 30-07-2018 8:21pm
    #1
    jdunne08
    Registered Users Posts: 147 ✭✭


    I have this expandable image viewer that I cant seem to change the size of the thumbnails in the viewer. What I want to achieve is the 2 thumbnails would fill the width of the screen the first being 40% the second being 60% and when clicked it expands and reveals the other half of the first thumbnails image but actually setting a width to the thumbnails is where I'm having trouble with.


    A mockup of what I want to make:


    Website%20example.png

    Jsfiddle of my progress: https://jsfiddle.net/Dunne08/8pd7brtx/24/


    Any help would be greatly appreciated
    Tagged:


Comments

  • Options
    #2
    Axwell
    Moderators, Business & Finance Moderators, Computer Games Moderators Posts: 10,462 Mod ✭✭✭✭Axwell


    Your spans have fixed with in pixels - you should be using percentages if you want them to be 40% and 60% for starters. Also they both have the same span class so they are both set to the same width currently.


  • Options
    #3
    jdunne08
    Registered Users Posts: 147 ✭✭jdunne08


    Axwell wrote: »
    Your spans have fixed with in pixels - you should be using percentages if you want them to be 40% and 60% for starters. Also they both have the same span class so they are both set to the same width currently.


    Thanks for replying. Do you know what I can do to separate them and give each their own span? I'm not too familiar with spans


  • Options
    #4
    Axwell
    Moderators, Business & Finance Moderators, Computer Games Moderators Posts: 10,462 Mod ✭✭✭✭Axwell


    You declare their class name as span3 where you have the two <li> elements - you can give them whatever class name you want and create the relevant css for that with values for width etc.


  • Options
    #5
    jdunne08
    Registered Users Posts: 147 ✭✭jdunne08


    Axwell wrote: »
    You declare their class name as span3 where you have the two <li> elements - you can give them whatever class name you want and create the relevant css for that with values for width etc.




    Yeah that's what I needed to do, got something going now. Thanks a lot for your time and help!


Advertisement