Bookmarklet?

[pentago]

I'm trying to make this a custom bookmarklet for use on Foundation 5 projects. Now, script gets loaded when called and everything but for some reason values i set aren't respected for some reason.

This is what I need:

'maxPageWidth' :     '1000px', (*if possible to use rem unit*)
'columnWidth' :      '8.33333%',
'columnCount' :       12,
'gutterWidth' :      '2em',

But grid gets all messed up for some reason.

This is how i call the script via bookmarklet https://github.com/pentago/gridOverlay/blob/gh-pages/javascripts/f5-bookmarklet.js

Care to assist?

Thanks!

[javasteve99]

So, the problem is that the block of code right underneath the variables is designed to convert the pixel values to integers for use in calculating flexible percentages. You're feeding one of those pieces of code a decimal value that's already representing a percentage, it's converting that to an integer and probably dropping the decimal places in the process, and then converting that back to a percentage. But now it's the wrong percentage.

You're experiencing a similar problem with your gutter widths. If you set both values to their pixel equivalents they'll work and calculate the percentages for you automatically.

I would recommend either setting columnWidth and gutterWidth to their pixel equivalents and letting the functions below them do the percentage math for you, or rewriting those functions to handle percentages and ems if you absolutely must declare your variables that way.

[javasteve99]

Ooops, now I see why you thought you could do that. It appears that the comment I wrote said other units were usable but then I never wrote the code to do that. Guess I'll have to update the comments.

[pentago]

Ah, cool.