Forums

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

Home › Forums › JavaScript › 4 div’s randomized on full screen?

  • This topic is empty.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • September 22, 2012 at 12:44 pm #39967
    StephBertha
    Participant

    Hi there,

    I’m trying to do a script, preferably jQuery, but I don’t know where to start.

    The idea is: I have four DIVs, each with a different background color. Each DIV is 100×100 pixels. These four DIVs will take up the entire background. So, when you’re on 1024×768, they’d fill up the screen. Again, when you’re on 1600×800, they’d fill the screen. Each DIV would be randomly placed on the screen, too.


    I’m sure there’s some math to start and probably some kind of shuffle script? I don’t know. Can anybody throw me a bone?

    September 22, 2012 at 12:52 pm #110583
    Darfuria
    Member

    I’m a little confused. If they’re 100x100px, are you saying they need to stay square to take up the whole of the page, or that they need to repeat enough times to fill up the screen?

    September 25, 2012 at 4:02 pm #110778
    StephBertha
    Participant

    Yes, to repeat enough times to full up the screen!

    September 25, 2012 at 4:03 pm #110779
    TheDoc
    Member

    So you have four divs, but there could be 150 divs on the page if the screen allows it?

    September 27, 2012 at 10:44 am #110898
    StephBertha
    Participant

    Yes.

    September 28, 2012 at 9:54 am #110966
    StephBertha
    Participant

    Is that hard to do?

    September 28, 2012 at 10:03 am #110967
    Paulie_D
    Member

    Will the divs have the same content?

    I’m having trouble trying to figure out the point. Most viewports / browser widths are not neatly sized in multiple of 100px.

    September 28, 2012 at 6:13 pm #110983
    StephBertha
    Participant

    Well, I have a background pattern, but the pattern isn’t seamless — all the squares are randomly colored in 4 shades of gray. :/

    September 28, 2012 at 6:58 pm #110984
    Paulie_D
    Member

    Ahhh…then it’s probably not divs that you want but random background images.

    I think you would have to have a whole bunch of images already set up and then use JS to tile them randomly in the background using a loop of some kind.

    Or perhaps a multiple SVG solution utilised in the same fashion.

    Sorry, I have very little (read..zero) ability in JS.

    My only concern is that you would have to be very careful as it’s quite possible that this effect would make your actual content unreadable…at least in part.

    Oh, one last thing…you might want to think about making them 96×96…makes the division easier.

    October 10, 2012 at 7:22 pm #111623
    StephBertha
    Participant

    That’s ok! This helps me think some more on how to do it. SVG, that’s interesting. I’ll look into that.

    Thank you!

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.