Menu icon Foundation

Engineer | Sioux Falls, South Dakota

I am a Software Engineer for a Consulting Company in South Datkota

My Posts


My Comments

Dustin Stage commented on JapperCat's post over 3 years

Well definitely not it's initial purpose, It may be possible to use Interchange to load in some of this content. It seems to me that you could put your header and your footer into their own html files and load them in as the default.

<div data-interchange="[../header.html, (default)]"></div>
<section id="body">
...some content goes here...
</section>
<div data-interchange="[../footer.html, (default)]"></div>

I don't know if I like this approach as it requires some crucial pieces of a webpage reliant on javascript (a user who doesn't have javascript enabled wouldn't see the header or footer), but it can be done.

Dustin Stage commented on John Cionci's post over 3 years

As Karl said, I don't believe there is a "proper" way to extend most of the foundation libraries. Some of the components have events that you can register functions to (such as the before-slide-change event in orbit) which will help extend the functionality.

As with all things JavaScript, you could go into the foundation.topbar.js file and edit it to implement your new functionality. This would make updating to newer versions of Foundation more difficult (as you would have to be aware of how any update to foundation might break your custom code.)

Dustin Stage commented on prakash's post over 3 years

Hi Prakash,

It looks like there was an issue when you uploaded your code (I can't see it), but I'm going to take a shot in the dark. I would guess you are trying to do something like this:
HTML
<div class="row">
<div class="large-1 large-centered column">
<div class="button"> <a href="#">Save </a> </div>
</div>
</div>

The trick here is simply the fact that you do not need to use the whole 12 columns in a row.

Posts Followed

No Content

Following

    No Content

Followers

My Posts

My Comments

You commented on JapperCat's post over 3 years

Well definitely not it's initial purpose, It may be possible to use Interchange to load in some of this content. It seems to me that you could put your header and your footer into their own html files and load them in as the default.

<div data-interchange="[../header.html, (default)]"></div>
<section id="body">
...some content goes here...
</section>
<div data-interchange="[../footer.html, (default)]"></div>

I don't know if I like this approach as it requires some crucial pieces of a webpage reliant on javascript (a user who doesn't have javascript enabled wouldn't see the header or footer), but it can be done.

You commented on John Cionci's post over 3 years

As Karl said, I don't believe there is a "proper" way to extend most of the foundation libraries. Some of the components have events that you can register functions to (such as the before-slide-change event in orbit) which will help extend the functionality.

As with all things JavaScript, you could go into the foundation.topbar.js file and edit it to implement your new functionality. This would make updating to newer versions of Foundation more difficult (as you would have to be aware of how any update to foundation might break your custom code.)

You commented on prakash's post over 3 years

Hi Prakash,

It looks like there was an issue when you uploaded your code (I can't see it), but I'm going to take a shot in the dark. I would guess you are trying to do something like this:
HTML
<div class="row">
<div class="large-1 large-centered column">
<div class="button"> <a href="#">Save </a> </div>
</div>
</div>

The trick here is simply the fact that you do not need to use the whole 12 columns in a row.

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content