I'm sure we've all seen the lightbox photo effect, however until now I've never had the opportunity/need to use it, and having implemented I must say it must be one of the easiest things to make work - and the final result is stunning.
Official Site - http://www.lokeshdhakar.com/projects/lightbox2/
Saturday, 29 November 2008
Thursday, 13 November 2008
Header 1 tags with a background image
Useful to remember if you wish your h1 tags to actually be your logo. Can be created using simple CSS as shown below (below example also makes the logo a clickable link back to the homepage):
h1 a {
display: block;
text-indent: -9999px;
width: 538px;
height: 88px;
background: url(../images/logo.jpg) no-repeat left;
outline: none;
}
The first link of the CSS code is display: block - this displays the link as a block using the dimensions you specify later.
text-indent: -9999px - this will allow you to write your header copy (for SEO and for browsers not using CSS) without it being seen ordinarily.
width: 538px - typically the width of your logo image
height: 88px - typically the height of your logo image
background: - A link to your image with the specification that it doesn't repeat (you should have no problems with it repeating anyway due to the dimensions matching that of the image - however its best to use this anyway.
outline: none - when this is clicked on as a link there wont be a faint line around the edge of it (as there normally is by default in Firefox.
h1 a {
display: block;
text-indent: -9999px;
width: 538px;
height: 88px;
background: url(../images/logo.jpg) no-repeat left;
outline: none;
}
The first link of the CSS code is display: block - this displays the link as a block using the dimensions you specify later.
text-indent: -9999px - this will allow you to write your header copy (for SEO and for browsers not using CSS) without it being seen ordinarily.
width: 538px - typically the width of your logo image
height: 88px - typically the height of your logo image
background: - A link to your image with the specification that it doesn't repeat (you should have no problems with it repeating anyway due to the dimensions matching that of the image - however its best to use this anyway.
outline: none - when this is clicked on as a link there wont be a faint line around the edge of it (as there normally is by default in Firefox.
Wednesday, 23 July 2008
Create a tab layout using CSS/HTML and JQuery
Good tutorial for creating a slick tab driven layout using CSS, HTML and JavaScript (JQuery):
http://nettuts.com/html-css...
http://nettuts.com/html-css...
Friday, 20 June 2008
New Browser Releases
It's been a busy few months for the browser companies. First we had the release of Opera 9.5 which came out to rave reviews after it did so well in the ACID3 test. Then hot on its heels was the eagerly awaiting release of Firefox 3. It was estimated that there were well over 8 million downloads of the popular Mozilla web browser on the first day alone!! Some of the add-ons may not yet be compatible with v3 but the developers are hurrying their way to ensuring that this doesn't stay this way.
You can download them both for yourself below:
> Firefox 3.0
> Opera 9.5
With Microsoft set to follow this with the release of Internet Explorer 8 sometime late 2008 the browser war is really hotting up. Hopefully Microsoft have finally listened to web developers across the globe and IE8 will be their most successful release yet...!
You can download them both for yourself below:
> Firefox 3.0
> Opera 9.5
With Microsoft set to follow this with the release of Internet Explorer 8 sometime late 2008 the browser war is really hotting up. Hopefully Microsoft have finally listened to web developers across the globe and IE8 will be their most successful release yet...!
Thursday, 29 May 2008
Graphic Design Inspiration
Awesome site with some amazing pictures and graphics on it. If you like what you see and want to try it yourself there is also some tutorials to go through:
http://abduzeedo.com/
http://abduzeedo.com/
Friday, 23 May 2008
Firefox 3 Release Candidate 1
Mozilla have publicly announced the arrival of Firefox 3 Release Candidate 1 - which should hopefully mean that the final release should only be about a month away!
The new release has received good reviews and you can download it yourself on the following link:
http://www.mozilla.com/en-US/firefox/all-rc.html
Be aware - This will overwrite your current version of Firefox, so if you aren't ready to make the move to v3 just yet... think twice before downloading it!
The new release has received good reviews and you can download it yourself on the following link:
http://www.mozilla.com/en-US/firefox/all-rc.html
Be aware - This will overwrite your current version of Firefox, so if you aren't ready to make the move to v3 just yet... think twice before downloading it!
SitePoint book giveaway - The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques
The folks at Sitepoint are very generously giving away free PDF copies of their popular book - The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques.
This offer expires on Friday 13th June 2008 so make sure you download your copy before then:
Download link
This offer expires on Friday 13th June 2008 so make sure you download your copy before then:
Download link
Subscribe to:
Posts (Atom)