Menu icon Foundation

Designer | New York

Former CFO and current principal of Level 1 Resources. Politics and economics junkie, NFL fan, avid reader, gym rat and amateur web designer.

My Posts


  • 6
    Replies
  • Foundation SASS CDN?

    By Tom Hogan

    SASS CDN

    Is there a Foundation for Sites SASS CDN? I like to play (ok learn) utilizing code pen and have been using: http://cdn.foundation5.zurb.com/foundation.css http://cdn.foundation5.zurb.com/foundation.js I'd like to switch to SASS but I can't seem to ... (continued)

    Last Reply by Nicholas Maietta over 2 years ago


  • 14
    Replies
  • Thank you Zurb

    By Tom Hogan

    thank youSWAGzurb

    I recently received a t-shirt and stickers for some modest contribution I made to the Forum. As kind and thoughtful as the gifts were, what really stood out was the personalized touch that came drawn on the packaging tube that the items were shipped in. ... (continued)

    Last Reply by Barabos Hilang Kendalis about 4 years ago







  • 4
    Replies
  • Topbar breaks when viewed at tablet size

    By Tom Hogan

    topbar

    Hi folks, I'm new to Foundation 5 and can't understand why my topbar breaks when viewed at tablet size. My markup is pretty straight forward with nothing special or particularly complex going on. I've tried working through it but can't come up with... (continued)

    Last Reply by Tom Hogan over 4 years ago


My Comments

Tom Hogan commented on Tom Hogan's post 2 months

 Val,
As a followup, when I add the following:
<script src="https://code.jquery.com/jquery-1.12.4.min.js"&gt;&lt;/script>
<script src="https://code.jquery.com/jquery-migrate-1.4.1.min.js"&gt;&lt;/script>
My DEV Console shows: JQMIGRATE: Migrate is installed, version 1.4.1 with no errors and Foundation works fine.
When I add the multizoom script Foundation breaks and I receive the following errors:
Uncaught TypeError: $ is not a function
    at responsive-tables.js:1
(anonymous) @ responsive-tables.js:1
product.html:568 Uncaught TypeError: $ is not a function
    at product.html:568
(anonymous) @ product.html:568
The first Uncaught TypeError is from the first line of Foundation's responsive-tables.js and the second is from the following script I add just before the body tag close (</body>) to initialize foundation.js 
<script>
      $(document).foundation();
</script> 

Tom Hogan commented on Tom Hogan's post 2 months

Hi Val,
First, thanks for the time you took to respond to my problem and I apologize for the delay in getting back to you.
I added the jQuery Migrate Plugin you suggested without any success. As soon as I add multizoom.js, Foundation breaks.
I know multizoom is ancient by today's standard but it's ideal for what I'm trying to accomplish. I want to swap a product photo with a parts diagram that a customer can switch between and zoom around on. You can see what I'm taking about here:
http://www.sistemiklein.com/en/products/6-6--boring-bits-slot-mortising-bits/350-hl-reciprocating-slot-mortising-bits.html
I stumbled across this page and it's exactly what I'm trying to do. I took a peek at the page source and that's how I found multizoom.
I'm more than willing to use any solution similar to multizoom but haven't I haven't been able to find one.
I'm open to suggestions.
Kind Regards
 
 
 

Tom Hogan commented on Tom Hogan's post over 3 years

Thanks Rafi,

Of course, 2 hours after posting my question I came across this on your twitter feed,

Learning Sass on Codepen - http://zurb.us/1yF2Nw1 Two things that are wonderful via @dudleystorey.

Tom Hogan commented on Tom Hogan's post about 4 years

I don't think the warning is anything to worry about. I believe it's just telling you the package.json file should have a repository field that tells you where the code is located.

Something like.....

"repository": {
"type": "git",
"url": "git://github.com/some_name/foundation_repository.git"
}

Tom

Tom Hogan commented on Will Barker's post about 4 years
Tom Hogan commented on Tom Hogan's post about 4 years

Marc,

Do you recall if you used the -g (global command) when installing Grunt in step 13? It sounds as if you're not able to run Grunt from any directory. You may simply need to re-run step 13. Also re-check steps 15 and 16.

You should see grunt files in the node_modules directory under the root directory of your new project as well as a gruntfile.js in the root directory itself.

Let me know.

Tom

Tom Hogan commented on Marc Pirard's post about 4 years

Marc,

I see that you posted your question in two places so for the sake of continuity, I posted my response here:

http://foundation.zurb.com/forum/posts/11597-how-to-install-grunt-and-libsass-on-windows

Tom

Tom Hogan commented on Tom Hogan's post about 4 years

Hi Marc,

Sorry to hear you're having problems.

The first thing you may want to double check is that the applications all made it into your environment path. Under environment variables you should see two windows. The top is labeled User Variables and the bottom System Variables.

The top window should have a PATH variable and the VALUE will be the path to your npm directory.
Mine is in ......\AppData\Roaming\npm

The bottom System Variables window should have a Path variable that includes the path to your Ruby, NodeJs and Git programs.

Node Package Manager (npm) is installed automatically as part of NodeJs and on my Windows 7 system it installed under ../User/MyName/AppData/Roaming. XP might be slightly different but it shouldn't matter as long as your system can find it. Under the npm directory should be a node_modules directory with bower and grunt-cli installed underneath. So it sounds like your ok there.

Double check your environment paths and let me know if they're ok.

Tom Hogan commented on Tom Hogan's post over 4 years

Ron,

I'm glad you found the tutorial helpful!

You should certainly leave the bower_components folder as it is since Zurb uses Bower (and the components you installed) to update Foundation. In fact I just updated Foundation to 5.2.3 using the bower update foundation command. If you were to delete or move Bower and/or its subdirectories I'm sure bad things will happen ;)

As for your second question regarding the installation of jQuery and underscore at step 11, I guess my answers is that it seemed like the logical point to do it.

You install Bower using Node.js/npm and Bower runs over Git so... npm--> Bower--> Git--> bower_components.

Tom

Tom Hogan commented on Brian Platter's post over 4 years

I'm pretty new to the whole grunt and libsass thing but managed to get it all working. I put together a "How-to" that may be helpful.

http://foundation.zurb.com/forum/posts/11597-how-to-install-grunt-and-libsass-on-windows

Let me know if it helps!

Posts Followed

  • 6
    Replies
  • Foundation SASS CDN?

    By Tom Hogan

    SASS CDN

    Is there a Foundation for Sites SASS CDN? I like to play (ok learn) utilizing code pen and have been using: http://cdn.foundation5.zurb.com/foundation.css http://cdn.foundation5.zurb.com/foundation.js I'd like to switch to SASS but I can't seem to ... (continued)

    Last Reply by Nicholas Maietta over 2 years ago





  • 74
    Replies
  • Foundation 5 and IE8

    By James Cocker

    ie8Foundation 5usage

    Firstly, I know, I know, IE8 is nearly dead and the recommended way to use Foundation on it is to stick with version 3. However, I have a new site build coming up which unfortunately requires IE8 support, and I'd really like to use the new Foundation 5 wi... (continued)

    Last Reply by manav singh 2 days ago






  • 9
    Replies
  • Creating a released, step by step.

    By Amiry

    releasescriptoutput

    Hi. I'm a new by to `Foundation`, `SCSS` and actually a newbie to entire system. I have followed steps described here: http://foundation.zurb.com/docs/sass.html to get started with `Sass` for both `Grunt + Libsass` and `Compass`. Here is my `Compass`'s config file:

    Last Reply by Amiry over 4 years ago


Following

Followers

My Posts

My Comments

You commented on Tom Hogan's post 2 months

 Val,
As a followup, when I add the following:
<script src="https://code.jquery.com/jquery-1.12.4.min.js"&gt;&lt;/script>
<script src="https://code.jquery.com/jquery-migrate-1.4.1.min.js"&gt;&lt;/script>
My DEV Console shows: JQMIGRATE: Migrate is installed, version 1.4.1 with no errors and Foundation works fine.
When I add the multizoom script Foundation breaks and I receive the following errors:
Uncaught TypeError: $ is not a function
    at responsive-tables.js:1
(anonymous) @ responsive-tables.js:1
product.html:568 Uncaught TypeError: $ is not a function
    at product.html:568
(anonymous) @ product.html:568
The first Uncaught TypeError is from the first line of Foundation's responsive-tables.js and the second is from the following script I add just before the body tag close (</body>) to initialize foundation.js 
<script>
      $(document).foundation();
</script> 

You commented on Tom Hogan's post 2 months

Hi Val,
First, thanks for the time you took to respond to my problem and I apologize for the delay in getting back to you.
I added the jQuery Migrate Plugin you suggested without any success. As soon as I add multizoom.js, Foundation breaks.
I know multizoom is ancient by today's standard but it's ideal for what I'm trying to accomplish. I want to swap a product photo with a parts diagram that a customer can switch between and zoom around on. You can see what I'm taking about here:
http://www.sistemiklein.com/en/products/6-6--boring-bits-slot-mortising-bits/350-hl-reciprocating-slot-mortising-bits.html
I stumbled across this page and it's exactly what I'm trying to do. I took a peek at the page source and that's how I found multizoom.
I'm more than willing to use any solution similar to multizoom but haven't I haven't been able to find one.
I'm open to suggestions.
Kind Regards
 
 
 

You commented on Tom Hogan's post over 3 years

Thanks Rafi,

Of course, 2 hours after posting my question I came across this on your twitter feed,

Learning Sass on Codepen - http://zurb.us/1yF2Nw1 Two things that are wonderful via @dudleystorey.

You commented on Tom Hogan's post about 4 years

I don't think the warning is anything to worry about. I believe it's just telling you the package.json file should have a repository field that tells you where the code is located.

Something like.....

"repository": {
"type": "git",
"url": "git://github.com/some_name/foundation_repository.git"
}

Tom

You commented on Will Barker's post about 4 years
You commented on Tom Hogan's post about 4 years

Marc,

Do you recall if you used the -g (global command) when installing Grunt in step 13? It sounds as if you're not able to run Grunt from any directory. You may simply need to re-run step 13. Also re-check steps 15 and 16.

You should see grunt files in the node_modules directory under the root directory of your new project as well as a gruntfile.js in the root directory itself.

Let me know.

Tom

You commented on Marc Pirard's post about 4 years

Marc,

I see that you posted your question in two places so for the sake of continuity, I posted my response here:

http://foundation.zurb.com/forum/posts/11597-how-to-install-grunt-and-libsass-on-windows

Tom

You commented on Tom Hogan's post about 4 years

Hi Marc,

Sorry to hear you're having problems.

The first thing you may want to double check is that the applications all made it into your environment path. Under environment variables you should see two windows. The top is labeled User Variables and the bottom System Variables.

The top window should have a PATH variable and the VALUE will be the path to your npm directory.
Mine is in ......\AppData\Roaming\npm

The bottom System Variables window should have a Path variable that includes the path to your Ruby, NodeJs and Git programs.

Node Package Manager (npm) is installed automatically as part of NodeJs and on my Windows 7 system it installed under ../User/MyName/AppData/Roaming. XP might be slightly different but it shouldn't matter as long as your system can find it. Under the npm directory should be a node_modules directory with bower and grunt-cli installed underneath. So it sounds like your ok there.

Double check your environment paths and let me know if they're ok.

You commented on Tom Hogan's post over 4 years

Ron,

I'm glad you found the tutorial helpful!

You should certainly leave the bower_components folder as it is since Zurb uses Bower (and the components you installed) to update Foundation. In fact I just updated Foundation to 5.2.3 using the bower update foundation command. If you were to delete or move Bower and/or its subdirectories I'm sure bad things will happen ;)

As for your second question regarding the installation of jQuery and underscore at step 11, I guess my answers is that it seemed like the logical point to do it.

You install Bower using Node.js/npm and Bower runs over Git so... npm--> Bower--> Git--> bower_components.

Tom

You commented on Brian Platter's post over 4 years

I'm pretty new to the whole grunt and libsass thing but managed to get it all working. I put together a "How-to" that may be helpful.

http://foundation.zurb.com/forum/posts/11597-how-to-install-grunt-and-libsass-on-windows

Let me know if it helps!

Posts Followed

Following

Followers