Advertisement

Foundation

  • Foundation
    A Sneak Peek at the Next Foundation for AppsYeti
    63 shares
    ZURB is always working on the next big tool to help web designers and developers alike. They make our programming days a little easier and a lot more fun. The Foundation framework is arguably the most well known, and soon there will be a new member to the family: Foundation for Apps. With it being released this November, it seems like a great time to see what Foundation for Apps will have to offer, what major features it has and what we can expect from this up and comer. In this roundup, we've collected all the information about Foundation for Apps. We've been given the opportunity to have an exclusive chat with Brandon Arnold, lead design, and Geoff Kimball, a designer at ZURB. They've shown us a first hand experience with the powerful features of this app, and today we're showing you what you'll be able to do with it.Read More…
  • Foundation
    How to Build a Shrinking Fixed Top Bar With FoundationFoundation bar
    158 shares
    A very common trend these days is the use of a fixed navigation, which shrinks to become less intrusive as the user scrolls down the page. In this tutorial, I'm going to show you how you can achieve this by using ZURBs Foundation Top Bar, some custom sass and jQuery. To top it off we'll add a couple of media queries to make our menu responsive. Let's get started!Read More…
  • Foundation
    Build a Top Bar Off-Canvas Navigation With Foundation 5Foundation menu
    179 shares
    Today, we are going to combine ZURB's Foundation 5 Off-Canvas feature with our top bar navigation. The result will be a nice custom navigation for desktop users and a sleek off -canvas menu for tablet and mobile users. Read More…
  • Foundation
    Foundation’s Sassy Styles ExplainedFoundation sass retina1
    24 shares
    In this tutorial we'll cover what can be done with the flexible Sass styles included in the Foundation framework. A lot of these offer a more customisable feature set than that of the CSS version, plus there are shortcuts which can be used to style items such as the top bar quickly and easily.Read More…
  • Compass
    Setting up Foundation With Sass and CompassFoundation sass retina
    19 shares
    Sass is a great way to speed up front-end development in general, I use it in every one of my projects. Sass (as with all other preprocessors) allows for nested styles, functions and prewritten code in what are called mixins. Foundation has a few different versions, currently we've covered the most common HTML/CSS variants, but now let's talk about a version built on Sass.Read More…
  • Foundation
    Foundation for Beginners: Sticky Navigation, Flexible Video and ZeptoFouindation retina
    5 shares
    In this part of our examination of Zurb Foundation we’ll talk about Magellan, which creates sticky navigation. We’ll look at visibility classes, right-to-left support, keystrokes, thumbnails, flexible video and the ins and outs of zepto. I’ll explain the use cases of these features and how best to implement them in your projects.Read More…
  • Foundation
    Foundation for Beginners: Joyride, Interchange, Tables and PanelsFoundation thumb retina
    19 shares
    Let's further add to our Foundation arsenal by looking at the Joyride plugin, which helps guide users through your sites. We'll also look at pricing tables, standard tables and interchange; a novel responsive image tool. We'll cover the implementation of these features with a simple template which you can download and play with.Read More…
  • Foundation
    Foundation for Beginners: Progress, Alerts, Tooltips and the Elusive Mega DropFoundation mega retina
    11 shares
    Let's add to our Foundation skill set by learning how to make use of progress bars, alerts, tooltips and the mega drop which Zurb make use of on their site, but isn't actually in Foundation. We'll look at adding all of these components into the contact form from the previous tutorial, using a touch of custom jQuery so you can get an idea of how these elements could work in your own projects. Let's get started.Read More…
  • Foundation
    Foundation for Beginners: Custom Forms and SwitchesFoundation form retina
    10 shares
    Following on from our look at buttons in Zurb's Foundation, let's now take a look at custom forms and switches. During this tutorial we're going to work on an exercise; a contact form which you can add to your projects or just play around with. Once we've built that, we'll move onto other form elements.Read More…
  • Foundation
    Foundation for Beginners: Buttons and DropdownsFoundation button retina
    36 shares
    In this part of "Foundation for Beginners" we’ll look at buttons, dropdowns and the "Clearing" plugin.Read More…
  • Foundation
    Foundation for Beginners: The Top BarFoundation top bar retina
    13 shares
    Let's take a look at the top bar included within the Foundation framework. As there’s quite a lot to cover we’ll break it down into easy chunks.Read More…
  • Foundation
    Foundation for Beginners: NavigationFoundation 3 retina
    5 shares
    One of the most important aspects of a front-end framework is how it handles navigation. In this part of Foundation for Beginners, we'll take a look at several forms of navigation, along with some JavaScript tools which add extra flourish. I’ll also introduce you to another helpful tool which will help you to become a better Foundation developer.Read More…
Advertisement
Advertisement