The CSS transform: rotate() property lets us rotate elements on the page. By putting this together with some jQuery-based javascript, we can click and rotate elements in place.
For the basics of CSS3 transform: rotate, see
part 1.
When using Nanoc, there are standard filter options for compressing CSS
and minifying javascript, but there’s no equivalent for HTML. However,
we can use Nokogiri to trim our HTML a little by removing some whitespace
and getting rid of comments.
To do this, we’re going to build a custom Nanoc filter. Create a
new file in lib/f...
We take a look at how to add a bit of extra flourish to a pure HTML and CSS banner. We’re going to add a tail to an existing banner. You’ll need to use the code for the effect already created in
part 1.