PurpleSquirrels

Category: Web Design

  • Hover shine effect with pure CSS

    Hover shine effect with pure CSS

    —

    by

    Ben Foster
    in , , , ,

    This is a simple example of a mouse-over shine effect I created using purely CSS. It uses a CSS generated element and CSS3 transitions to animate the effect. See the comments in the markup below for further explanation of how it works. Live demo: Click Me Simple HTML markup: [cc lang=”html”] Click Me [/cc] And…

  • Comparing custom font display with @font-face

    Comparing custom font display with @font-face

    —

    by

    Ben Foster
    in , , ,

    This is a little experiment I conducted comparing the way different browsers render custom fonts through @font-face. What I found was that the two browsers that displayed them best were IE8 and Firefox 4 Beta. The worst browsers were Opera and Safari. Opera seemed to make the characters extra skinny, and Safari made the characters…

  • The Megahorns Website Refresh

    The Megahorns Website Refresh

    —

    by

    Ben Foster
    in , ,

    I have just launched a new website design refresh for The Megahorns, a local band from Melbourne. Quite a large band actually with heaps of saxes, trumpets, trombones and drums! The re-design involved building a new WordPress theme from the ground up to incorporate into their existing CMS. The design incorporates graphic elements from their…