kauress
[sociallocker id=”3578″] Part 2 with the code repo Stand-alone parallax scrolling library for mobile (Android + iOS) and desktop. No jQuery. Just plain JavaScript (and some love). The skrollr.js library lets you add scrolling animations (of which parallax is one) to your webpage (Android and IOS included) by targeting HTML elements via data attributes. No JavaScript or Jquery is needed. For example you can make
Buttons for a Kickstarter Twitter Bootstrap Theme. [codepen_embed height=”395″ theme_id=”21518″ slug_hash=”GoExzy” default_tab=”result” user=”Kauress”]See the Pen <a href=’http://codepen.io/Kauress/pen/GoExzy/’>Twitter Bootstrap Buttons</a> by Kauress (<a href=’http://codepen.io/Kauress’>@Kauress</a>) on <a href=’http://codepen.io’>CodePen</a>.[/codepen_embed]
I was bored so I coded a few ghost buttons. Nothing fancy, just ghost buttons with a hover on effect that has a border property set to none. So when you hover over the button, the border disappears . They’re responsive and no special media queries need to be set for these since they use Twitter Bootstrap’s btn class. These also use Font Awesome Icons
CSS only toggle button. Modified from the original, which is here [codepen_embed height=”466″ theme_id=”21518″ slug_hash=”YwpVRY” default_tab=”result” user=”Kauress”]See the Pen <a href=’http://codepen.io/Kauress/pen/YwpVRY/’>CSS Toggle Button </a> by Kauress (<a href=’http://codepen.io/Kauress’>@Kauress</a>) on <a href=’http://codepen.io’>CodePen</a>.[/codepen_embed]
Earlier during the year I did a screencast on coding a full width video header like AirBnB. Original post HERE I’ve collected all the questions and responses from youtube comments so far for the screencast and compiled them here There are a few common issues that people had: Browser Support Question 1: The video doesn’t play on safari and IE is that normal? Firefox and
A beginner meteor.js chat app. The code isn’t up on on github as yet. Have a look at mychatty, as a plus meteor lets you host your webapps free
This is a tiny workflow for those just starting out with git. It combines pushing a local folder to github initially and then pushing changes made to code files (example index.html)
I did some breaking and re-making of twitter bootstrap’s navbar. I love how convenient everything in twitter bootstrap is with all the pre-defined classes etc but it does take some time to customize bootstrap components and make them a little less bootstrappy…. [codepen_embed height=”568″ theme_id=”21518″ slug_hash=”WrxqVE” default_tab=”result” user=”Kauress”]See the Pen <a href=’http://codepen.io/Kauress/pen/WrxqVE/’>Transparent Twitter Bootstrap NavBar</a> by Kauress (<a href=’http://codepen.io/Kauress’>@Kauress</a>) on <a href=’http://codepen.io’>CodePen</a>.[/codepen_embed] Here’s the HTML
I recently did a tutorial on coding a full width header video like on airbnb. I love how they’ve used a video in their header, it really does alot for their page and branding. The project itself isn’t hard to do, all you really need to know is how to use the video tag fromt HTML5 and incorporate it into twitter bootstrap’s framework
<contentditable = “true”> lets the reader edit content within the div <video> directly embeds a video on a page, no plugins, iframes etc <small> presents small text, great for styling <header> & <footer> pretty self explanatory
