I am working on a Foundation 5 website and i would like to detect the breakpoint change when the user resize the browser window. Here is a workaround found in the Foundation Forum.
1. Add the following piece of HTML to your website. Since i am working with Drupal 7 with the Foundaiton 5 theme, i just add it to the page.tpl.php in the subtheme.
<!-- For breakpoints checking in js -->
<div id="breakpoints">
<div class="breakpoint-small show-for-small-only" data-size="small"></div>
<div class="breakpoint-medium show-for-medium-only" data-size="medium"></div>
<div class="breakpoint-large show-for-large-only" data-size="large"></div>
</div>
Continue reading Foundation 5 – Execute Javascript/jQuery on breakpoint changed →
We got the Foundation 5 with Sass styling working on our AngularJS project which was scaffolded by Yeoman.
Let’s continue our ng-foundation example above.
To utilize the Foundation framework in a more effective way, the Mad Mimi team creates some native AngularJS directives based on Foundation‘s markup and CSS which is available on Bower.
Continue reading AngularJS directives of Foundation →
The generator-angular written by the Yeoman team comes with Bootstrap integration. But instead of using Bootstrap, i would like to use Foundation 5 with Sass. The following example is created under Node.js v0.10.29.
1. Create your project directory. In my case, i will name the project ng-foundation.
mkdir ng-foundation
2. Move to the ng-foundation folder.
cd ng-foundation
3. Scaffold the AngularJS project using the generator-angular as usual.
yo angular
Continue reading Yeoman – Setup AngularJS and Foundation 5 with Sass →
Dream BIG and go for it =)
Eureka! 