Grow your CSS skills. Land your dream job.

Infogrid – Hide when clicking outside the grid

  • # March 6, 2013 at 2:21 pm

    **EDIT:** Here’s my own JQuery InfoGrid version. Believe it or not ⇒ http://codepen.io/tovic/pen/uLvDE

    I use `em` units for `padding`. So if JQuery change the font size, then the `padding` will also change. No need extra `padding` animation. This InfoGrid also fluid width.

    Editing is tiring.

    # March 6, 2013 at 4:32 pm

    Looks great in the codepen….. seem to be having some trouble getting it to work outside that environment however….. Likely something obvious I’m missing lol….. I’ll keep trying and let you know if/when I get it.

    # March 6, 2013 at 6:12 pm

    Thanks by the way – saved me TONS of headaches!

    Ok…. got it working (I had to export it rather than copy/paste each section – I think it had to do with where I was putting the

    # March 6, 2013 at 9:31 pm

    Use background instead of images. I’v updated the Codepen.

    PS: The effect looks jumpy from my computer when using Codepen but works smoothly from original HTML test page.

    # March 7, 2013 at 12:07 pm

    Bingo :) – Everything seems to be working great! Thanks again for your help! – I saw your comment in the code and I can’t add a “credits” link anywhere sadly, but I may be able to swing adding a link in the comments. Unfortunately this is going to be used on a MAJOR (F. 500) website (You’d think I’d get a budget to get this done right?) and they wouldn’t go for putting anything overt.

    # March 7, 2013 at 12:18 pm

    > I can’t add a “credits” link anywhere sadly

    humans.txt

    http://humanstxt.org/

    # March 12, 2013 at 7:24 pm

    So everything is all done, and I’m talking to my boss about putting a Humans.txt in there. I have seen one small issue that’s plaguing me (no one else has noticed yet thankfully). When using IE, when I click on an item the last item will occasionally get pushed down to the next line for a second than pop back up. This seems to happen multiple times rapidly. I saw your note in the js file so I’m not sure if it’s related to that issue you solved, or if it just happens to sound similar. Any idea what I can do to solve this? I’ve tried making the whole thing smaller, but it still seems to occur.

    EDIT: I’ve also made each block a little smaller individually and that doesn’t fix it either :(

Viewing 7 posts - 16 through 22 (of 22 total)

You must be logged in to reply to this topic.

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