I have been playing a little bit with some cool css3 examples recently and will be listing some further little tricks you can incorporate in to your K2 templates. In fact, your not just limited to K2, but even Joomla or any other media comprising HTML and CSS.

In this example, I am going to apply an effect to the social media icons, which will cause them to spin 360 degrees when you hover over them.
This is simple and is cross browser compatible for FireFox 4/5, Opera 10.5+, Safari 3.1, Chrome, IE9 Tested!! Open up your k2.css file and search for .digg and you will find this section of css.

Existing Image Code

Now we dont actually need to make any change to this code, just simply extend it a little. The following is the additional css code to add in, simply copy and past it below the a.technorati.

The New Code

Save your k2.css, upload it to your server and navigate to a relevant k2 page and then test.
All being well you should see your social icons rotate, just like on this page!!

How it Works

I wanted the transition to happen on the icon, so as they are all individual atags it was easy to just group them together to add the transition and the transform with its behavourial property :hover could also be extended with :active.

Looking at the transform code first, this is end position of where the icon to be and in this case we are spinning it around 360 degrees around the Z-axis which is the axis that extends away from the screen.

Without this transition, nothing is going to happen. Rotating by 360 degrees is going to make the icon spin ‘full circle’, back to the same position it started from but the browser recognises it as a separate position. By adding the transition property, we’re telling the browser to essentially animate between two points. The default starting point for the rotation is 0 degrees and the second point on hover is 360.

transition: transform 0.4s ease-out;

The first part of the transition is what property we want transitioned which of course is the transform. You can also define all or separate properties with commas. The 0.4s is the duration in seconds and the ease-out is the timing function.

If you only want to rotate the icons 180 degrees, then just change all the (360deg) to (180deg) or any other value you want.
For IE support, it works, but you will need to do some additional research and calculations to get the right matric values needed.You can check Microsoft or Wikipedia for some further information.

So after finally making it to the most amazing venue ROLDUC, a 1000 year old monestory, we dropped of our bags and met a few of the other attendess then headed off to the Pre Party.

This was organised by the Nooku team and did a great job of selecting a venue and organising it.

The venue is Europes largest indoor down hill ski slope SKIWORLD which could be seen from miles away as we approached the city.
Up close, the place is crazy, its huge.  
Speaking with those in the know about skiing, its exactly like a whole ski resort has just been placed in the city and is really authentic.  The down hill run looked great fun, but I kept well clear and stayed in the warmth of the bar where only my fingers got cold on the beer.  

Meeting the great members within Joomla, Nooku Team, Joomla Shack, Joomlart, Valanx, RedShop and so many more.
So many more to met, but certainly up on the Joomla and Beyond Challenge.

The journey to JAB11 is well under way as @k2joom, @philiplocke, @joomkit, @jackbremer, @hughwilliams, @jordanworner touch French soil

The two cars met in Dover at just before 7am this morning for a breakfast, at Cafe Flicks.After filling up on tea, coffee and a selection of fried foods, we hit the road for a brief drive to the sea port of Dover for our P&O crossing to Calais.

Timings were perfect as we literally only had to wait a matter of a few minutes before we boarded, right at the front of the ship.
After a quick dancing session by the Bremer brothers, we hit the executive lounge for complimentary Champagne, well at least those of us that were not driving.  The crossing was calm and smooth and our engine still had power, unlike @brianteemans twin prop airplane which had to be changed at the last minute before departure.

Within a space of around 1.5 hours, we landed in the sea port of Calais and promplty departed for our road trip to Brugge where we planned to stop for a bite of lunch. All thats left to do now, whilst I sit in the back of Phils writing this entry, is to get some form of internet connection setup. Unfortunatly, as much as I love my HTC Desire HD, the battery life is shockingly poor and died already after just 5 hours use, good job I brought a variety of chargers.

I wasn't quite expecting my first blog about Joomla and Beyond to be produced quite so soon, as its only just 3am nd hence the name of this post.

Over the years, I have done a fair amount of over seas travelling through my previous job as a Field Service Engineer so I am used to getting preparing to go away, but for some reason, preparing for JAB has been a vastly different to all other occasions.

It's taken me much longer than normal to get my bags packed, no idea why as I have did my pre-pack list of what I need to take,  which has been doubled check more times than I have fingers.  I have packed less than I would have done normally, this trips less than a week instead of the usual month long stints I used to do.

Yet for some reason, I am up and dressed before my alarm clock has even had chance to think that it has a job to do.

With all this extra time, I am really going to kick myself when I later find out that despite all my check lists I still forgot something, I so hope not.

Time for some tea, whilst I awaiting Locke Taxis to arrive.

Joomla & Beyond 2011, Kerkrade in the Netherlands takes place between the 6th and the 8th of May.

This year, I am pleased to be able to attend this event.
The best Joomla event in Europe and possibly the world!!

I will be travelling to the event with Phil Locke (OSM), Alan Sharpe (JoomlKit), Jack Bremer (3B Digital) on the JoomBall Rally and will be posting random goodies on route and during the event.

So keep up to date with my latest coverage of the show and more specifically, on K2 news and presentations as they happen, right here. Simply subscribe to this category and get emailed on each and every new item punblished.

As K2's biggest fan, I am also pleased to be able to spend a little time with Fotis from Joomlaworks to chat and have a little interview, which will be published on www.simon.getk2.org.

If you have a specific and interesting question you would like me to ask Fotis, then send me an email simon at k2joom dot com or post a comment below.

This page is an example of Horizontal Comments, a free template element from K2Joom which replaces the default K2 comments form.

The download consists of two main files and two images:

1. horicomments_style.css
2. item_comments_form.php
3. New Loading image
4. New border image

The css file contains just the relevant classes for the comments and it can be copied to replace the original code in an existing k2.css file, whilst the item_comments_form.php can simply replace the exisitng file within a K2 template. Do NOT, over ride the core files.

In the example you see here, we created a new K2 Category and assigned the horicomment template to it. All parts, other than comments, are then loaded using the default template and css. If you have a modified version of the default template or use a template such as rounded and rename it to default, then you will retain your site style, but with a different commenting layout.

Take a look at the example below, you will see the new style comments form, contained within the red dashed borders.
Please Note: The ReCaptcha style is set from within your K2 parameters, we have not over ridden this. 

All font colours and styles will be inherited from the Joomla template.

UPDATE

We can provide customisation and integration if you so wish.
Download is now provided on this page, see the link below. 

Download This is a Free download.

This Is CatOlog our February K2 Template - Exclusive to K2 Template Members

CatOlog is a Category and Category view template designed for full width views to allow maximum content area to showcase products or services.
All contents extras are held within the left column which is set to display a maximum of 25% of the display to keep the main content area clear for data.
Demo can be seen here. 

Demo Setup

To produce this demonstration, we started by creating a parent category with 4 sub categories.  3 of the sub categories inherit parameters from the first sub category.
The parent category is set to Catalog mode Yes so that only content in the parent category is displayed and will not display content from the sub categories.
All category and sub category images are set to display at 200px to make use of the possible 4 column wide sub category display. The 3D images shown in this demonstration have been created by Simon Wells using Solidworks CAD software.

CatOlog can be assigned to individual categories and can also be merged with other templates and css files.
A full version will be released in due course.

For any presales questions, please email support at k2joom.com

Look out for a new forum coming soon.