Grow your CSS skills. Land your dream job.

Set a picture to dispaly on 80% of the screen width

  • # March 12, 2012 at 1:39 pm

    I’m using the tinybox javascript code which basically opens up an image on the screen when a link is clicked.
    The thing is, I can set the height and width of the picture in the javascript code, but I want it fit 80% of the user screen resolution so that it doesn’t become too larger on smaller screens.

    Here is the code I’m working with:


    Any one can help me, please?

    # March 12, 2012 at 1:50 pm
    var newHeight = window.innerHeight*0.8 + 'px',
    newWidth = window.innerWidth*0.8 + 'px';

    put these variables in for the height and width :D

    # March 12, 2012 at 2:09 pm

    Hmm I did it but it doesn’t seem to work.
    Can you put the two bits of code together, maybe I did it in the wrong way or something… :P

    # March 12, 2012 at 2:15 pm

    If @karlpcrowley will allow me:

    # March 12, 2012 at 2:18 pm

    Cheers, that helped! :)
    Thanks karlpcrowley.

    # March 12, 2012 at 2:19 pm

    Don’t forget to thank @Senff
    :) :)

    # March 12, 2012 at 2:41 pm

    Thank you @Senff :) :)

    # March 12, 2012 at 2:42 pm

    Anytime :)

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".