Lilula

Coming soon.

CSS Image Rollovers

26February2008

I know there’s a billion tutorials on how to do these, but I’m going to show you the easy way when it comes to block navigation (vertical and horizontal). No moveable backgrounds that cock up in caching browsers. No JavaScript - I’m looking at you Dreamweaver - and it’s simple, fast, valid and cross-browser compatible. All that and a bag of chips.

I’m new to tutorial writing, so bear with me. You will need to know basic HTML and CSS. If you feel lost refer to W3 Schools or post a comment here. I’m going to use a horizontal column such as the one utilised in my current layout as an example. We’ll start with an image of what it’s going to look like first:

Sample Menu

Holy crap, it’s beautiful. Now let’s create a solid image of the rollover effect:

Rollover Sample

I’m using a subtle effect because I want my rollovers to move with the same stealth as ninja’s. Also it’s less confusing for the visitor and creates a more consistent and navigable interface whilst incorporating a moderate level of interactivity.

Now we have those two images, slice up the first one - namely what your navigation will look whilst it’s stationary. Leave the hover image intact since for block navigation you won’t need to mutilate the hover image into tiny pieces. Using my example, we should now have five sliced images for each piece of text and one block image of the hover effect. Time for a little bit of trickery.

Firstly let’s create our navigation in HTML using lists:

<ul id="navigation">
<li class="home"><a href="home.php" title="Home"><span class="hide">Home</span> </a></li>
<li class="about"><a href="about.php" title="About"><span class="hide">About</span> </a></li>
<li class="righto"><a href="righto.php" title="Righto!"><span class="hide">Righto!</span> </a></li>
<li class="tea"><a href="tea.php" title="Tea"><span class="hide">Tea</span> </a></li>
<li class="weather"><a href="weather.php" title="Weather"><span class="hide">Weather</span> </a></li>
</ul>

That was so easy I fell asleep and concussed myself on the keyboard. Notice there’s a space after the spanned text - you will be needing this so don’t forget it. Now we’ve got our navigation set in HTML, it’s time to move onto the CSS. We’ll call each image something logical and the hover block ‘hover.gif’:

#navigation {background:url('hover.gif') no-repeat; width:150px; height:200px;}
#navigation li {display:inline; list-style:none;}
#navigation li, #navigation {padding:0px; margin:0px;}
.home a {background:url('home.gif'); height:43px;}
.about a {background:url('about.gif'); height:38px;}
.righto a{background:url('righto.gif'); height:35px;}
.tea a {background:url('tea.gif'); height:38px;}
.weather a {background:url('weather.gif'); height:46px;}
#navigation a {display:block; width:150px;}
#navigation a:hover {background:none;}
.hide {display:none;}

Fin! If you’re feeling particularly fancy you can have ‘clickable’ rollovers using the :active pseudo-class. For vertical rollovers change the width on the navigation but keep a consistent height. To move the navigation around within a space, place it within a div. There are plenty of unexplored possibilities.

I’m paranoid about coupling an internal style sheet with my external one so I can’t actually show you how this particular sample rollover looks here on my blog - such is life. However you can download a working sample in case the above made no sense.

If you make a rollover using this tutorial it would give me great pleasure to see it. Show some love and either contact or link me - who knows maybe I’ll link you right back in this tutorial.

Happy rollovering fellow netizens!

Comments are off

My Cat is Evil

23February2008

If Billy got any fatter or meaner he’d turn into a tub of lard with a Hitler moustache. Just look at him in the picture below - he’s the embodiment of feline fury.

Our story begins one fine evening whilst I was dossing away on the computer as usual. In comes Billy feeling particularly joyous, rolling over, exposing the folds in his stomach. And so I start petting him, particularly pleased that he had decided to extend the olive branch of peace. How mistaken was I.

BillyJust like a Trojan horse - awaiting the opportune moment to unleash it’s hidden power and kill all the inhabitants of Troy - he attacked.

It was a fearsome fight involving digging his front claws into my hand, lacerating my skin as he pulled my hand into his mouth and biting (as well as drooling onto) my hand. The brutality didn’t end there either.

Billy wanted to make sure that I’d never use my right hand ever again (my writing hand too the sly bastard) and as such brought his back paws up and started cycling them viciously as though he were sprinting on the spot and my hand were the ground.

The horrible battle eventually ended, but not because I deservingly kicked him in the face. He jolted and ran for his life as I pulled away, probably clever enough to realise that a ten stone woman can kick the ass of a one stone furry gimp for a cat.

ScratchesSo here’s the damage - the swelling isn’t visible. Thousands of skin cells lost their lives. I now have a sad expression permanently etched on my visage unable to forget the fateful day on which Billy bit the hand that fed him.

I have yet to take out my revenge, although last night whilst he slept at my feet I kicked him accidentally. I was dreaming my dad was pissing me off and awoke to a sorrowful meow as Billy darted off my bed to go feel sorry for himself.

Sodding cats.

Disclaimer: I would never purposely hurt my cat. Ever. I love my stupid meatball even if he is more aggressive than a shit load of Spartans.

Comments are off

Happy Rachael?

22February2008
Finally got round to tweaking the layout to look normal in IE6.Comments are off

We All Love Dust

22February2008
I Love Dust have just relaunched their portfolio. May cause haemorrhaging due to awesome.Comments are off

EEE! I’m In Love!

21February2008

Those of you who have been subject to my squeeing over my new Asus EEE PC are probably familiar with what I’m going to say in this blog entry. However those of you who are not sure what I’m talking about walk with me. I will teach you the ways of the ultra mobile PC young grasshopper.

My fascination for ultra mobile PC’s began a year or two back. I had grown tired of lugging my old heavy laptop around at university since I had to carry it most of the time from building to building, to the pub, around the town centre - you get the point. My shoulders would be raw by the end of the day, often bruised and sore. So imagine my delight when I heard that there was such a thing as laptops specifically designed for weaklings such as myself.

I started with a Toshiba convertible tablet PC. Sure it was light, useful and impressive as hell with it’s tablet screen but it was also slow, buggy and temperamental. It served well as a tablet, but not for much else. It still felt bulky in the majority of my bags and was heavy alongside textbooks and the various bits of shrapnel I carry around.

Just before Christmas I started looking for a new laptop mainly because the Toshiba had a fracking melt down. Being the poor student that I am, I was disheartened at the high prices for the now ever so desirable ultra mobile PC’s. I just wanted something portable that could process documents and surf the internet without having to pay an extortionate amount or resort to getting a Blackberry and risk looking like an anal business orientated individual before I graduate.

That’s when I stumbled upon the Asus EEE PC. At first I tossed it aside thinking “512MB RAM and 4-8GB memory? I don’t think so!” On top of that the operating system was unfamiliar and even though it was cheap I was risking a lot in buying a gadget that could potentially fail to meet my needs. That was before I started looking into the rave reviews. Most websites will contain a star rating of five out of five for the Asus, with the lowest I’ve seen at about four and a half stars out of five from an average of about two hundred customers. That’s enough to even get the little ol’ pessimist in me interested.

Being laptop-less was also having a profound effect on my studies - I couldn’t do any work at university unless I used a Mac or PC and even then it was impersonal and tiring to be sat in the same area all day. So going on my gut instinct (which has failed me in the past) I went ahead and bought a white Asus from Expansy’s. Let’s go through all the specs:

The webcam is seriously impressive. I thought it was going to have the same sort of quality as a mobile phone camera, but it catches light incredibly well (even in the dark) and the sharpness of the videos and photos I’ve taken do not look like the work of a 0.3 MP camera. I would put some up here for you to see, but I’m feeling lazy so they’ll only be published on popular demand :D

It’s also incredibly fast. Linux boots up in under minute, and hasn’t frozen at all. I can easily run two or three programs at a time without it lagging which is a plus. I haven’t had the chance to run more applications at one time - not that I would need to anyway! The applications are also incredibly useful and create documents (word processing files, presentations and spreadsheets) compatible with Macs and PC’s. You can’t imagine how useful this is to me when I have to constantly interchange between the two.

Not to mention all the other little goodies that come with the laptop. It comes with free anti-virus, games (solitaire, Tetris, a Linux version of Bubble Trouble), a media player compatible with loads of files, instant links to useful websites, Thunderbird, Firefox, a couple of paint programs, educational programs (which I aren’t all that useful to me - but they are pretty nifty) and plenty more. How they crammed it all in I’ll never know.

I swear the battery has lasted me more than three hours. I would be so bold as to say it’s lasted me up to around four or even five hours but maybe that’s because it’s brand new and I’m still incredibly infatuated with it. Not that three hours is a problem since most of my lectures only last around two.

The internet runs as quickly as the network it connects to. No surprise there. The only problem is that it doesn’t support WPA2 encryption, which is what the wireless at university has. I’m waiting for a hack or patch to become available since it would be useful to connect to the university internet! Apart from that I’m loving that I can chat on Skype. I’m waiting for another patch on that so that I can do webcam chat since it’s not supported at the moment.

Having a 4GB hard drive has not been as troublesome as I thought it would be. So far I have a handful of MP3’s, quite a few vidoes, photographs and fairly large documents floating around in the Asus and still have plenty of space. We’re so used to getting devices with 100GB+ that I think we’ve forgotten just how large just 1GB is. I’m not using the Asus as a desktop replacement - neither would I recommend that anyone use it for that purpose - so 4GB is just fine to keep a few lectures notes, essays and music on. Should it ever present a problem I could upgrade the hard drive.

Now for the beauty of this little laptop - it weighs less than a bag of flour. Go to your kitchen right now and pick up your average 1.5kg bag of flour, then say to yourself “An Asus EEE PC weighs considerably less than this.” It’s only slightly heavier than a Nintendo DS. I kid you not. It’s an absolute dream carrying it around. I can even fit it into my smaller bags. It’s also robust but I’m not about to go test it by using it as a rugby ball.

Of course the Asus probably isn’t for everyone. It suits my needs very well, and it would also suit your needs if you’re a commuter who likes to travel light, a student at school, college or university, a parent who wants to introduce their children to technology without spending a fortune or a gadget enthusiast. It’s probably the only highly capable and potent ultra mobile PC to be sold for such a low price - I’d highly recommend it.

Comments are off

I Haz Brainz!

13February2008

Today has been particularly ego boosting, and as such I now have the inspiration to write another me-centred blog entry. All the while a small voice in my head continues to ask the question - how do you all cope with this vain blathering I call blogging? Does my stupidity amuse you thus? Well, stupid no more! Here is plausible proof that I might be a wee little smarty pants.

My essay results came back today - the topic being behaviour on the internet, a particular fancy of mine. After dubiously ogling my total of seventy-four I proceeded onto asking Chris why he was congratulating me. I’m completely oblivious to the way things are marked in university even after nearly two years of attendance on this particular course. After all, it could have been seventy-four out of three billion which would have meant I had royally fucked up.

Chris then told me that I had achieved a first, with seventy being the boundary. Four marks over the minimum requirement for the grade, but a first is a first right? If I can only be improving then this bodes rather well considering I’m only halfway through my second year out of three.

Unfortunately this essay was simply for poops and giggles and does not contribute towards my final grade. I only found out after Rich asked the tutor, which left me feeling a little bitter since it takes away any sense of accomplishment. I would have written about ass berries out of spite if I had known earlier.

To further perpetuate the false belief that I have more than three brain cells - they do get awfully lonely at times; I just wish brain cell #2 wouldn’t cry so much - my dad came home beaming today because the programming firm he works for have a job proposal for me. They want to create a design team to tackle interactive interfaces and applications for the web and want someone with my ‘expertise’. Lawl, wut?

With roundabout £35,000 a year (apparently) to start with it’s a pretty tantalising offer. I figured that for now I want to finish my education and see what’s out on the market before settling down at my decrepit age of twenty. Looks like I’m right back to being an idiot for wanting to turn down such a sweet job.

Comments are off

Dear Barnbrook…

12February2008
Here’s a few tips on how to make money online without selling out your cause.Comments are off

Second Batch of Films

09February2008

As mentioned in my review of LOVEFiLM, this second batch arrived in two pieces with Blades of Glory being the second lot. Not that I was hoping to relish in the cinematic glory that is another Will Ferrell film, but damnit I sometimes require something that does not demand a single brain cell in order to be watched. And isn’t Jerry Springer. Anyway, this time round I received Some Like it Hot and Children of Men. Rated in the order I watched them:

Despite wanting to watch Some Like it Hot for years, Mike and I decided to watch Children of Men first since we both haven’t seen it. My brother insisted that I burn it instead, harping about how it was the worst film he had ever seen in his short eighteen year life span. He wasn’t too far off. Children of Men raises some spectacular issues, and reminded me a lot of V for Vendetta in that it takes place in a controlled British state. However the dialogue could have been written by, well, my brother, and the story was riddled with inconsistencies and loose ends. A barely there two out of ten - with the two given simply for the beautiful scene where the army cease fire to hear a baby’s cry.

Since Blades of Glory didn’t take too long to follow the other two, we sat down to watch it one late evening whilst I did my nails. As aforementioned this is another Will Ferrel film, with appearances from that goon who played Napoleon Dynamite (and we all know how ‘amazing’ that was). There were a few stupid moments which made me laugh pretty loudly, but otherwise that nothing too memorable. Good as background noise whilst painting my nails, so three out of ten will suffice. Oh, and the ice skating costumes were pretty kick ass.

Last but not least, the best of the bunch was Some Like it Hot starring Marylin Monroe. I can see why this is loved even so many years after it’s release. It’s a classic comedy with a little bit of dirty humour. Even so I felt some part of the films dragged themselves out, and felt sorry for Monroe’s character as she was wooed by the romantic yet shameless saxophone player played by Curtis. However the dialogue was sharp and there were some really funny moments (mostly with Lemmon’s character who had me in stitches with practically everything he said). I’d definitely recommend it, it’s a timeless film which I’m giving a well deserved eight out of ten.

Comments are off

First Batch of Films

08February2008

I’m going to do quick reviews of films old and new that I receive from LOVEFiLM. Ideally I should do it over on their site, but this is a better way for me to gain hitz ya’ll expoze sure readership. Lovely, buttery readership. The films in question here are Volver, Sunshine and V for Vendetta. In the order I watched them:

The one I started with was the one I wanted to watch the most - V for Vendetta. I had only glanced at the film once whilst drunk at a friend’s party. I don’t even remember what we were celebrating, but it certainly was not Guy Fawkes. I had no clue what the film was about which is a great premise for wanting to watch a film however I can say I genuinely enjoyed it. V for Vendetta is in the vein of 1984, with Britain being a highly controlled state. I loved V’s persona and I found his cryptic chats with Natalie Portman’s character an enchanting relief to the otherwise gritty and political subject matter. It’s also less predictable than I initially thought which is always good. A modest six out of ten for this little slice of anarchy.

Then there was Sunshine. It’s funny this wasn’t first on my list because it has Cillian Murphy as one of the lead characters. The film is simply a space mission gone wrong like so many other films, however it pays homage to classics like Alien, 2001 and The Shining, using camera angles, dodgy lighting and music (or lack thereof) to create atmospheric tension as the crew start developing space dementia. All very lovely, but the plot was somewhat predictable and a little drawn out to my taste. However there were some sweaty close-up scenes of Cillian screaming “FUUUUUUUUUUUUUUUUUUUUUUUUUCK” which left me uncomfortably hot and bothered in front of my whole family. Four out of ten overall, but if those scenes were to stand alone as a film it’d be higher.

I knew I had to rent Volver simply because it appealed to my infatuation with Hispanic culture being Latina myself. The only reason I hadn’t seen it earlier was because no one else I knew was interested, and to top it off I was very sceptical about Penelope Cruz being able to act having seen such masterpieces like Sahara and Woman on Top. However forty-one wins and forty-six nominations certainly draws ones attention and I have to say that I am very glad I rented this film. It is one of the best films I’ve seen all year, and my only regret is not seeing it earlier. I saw a lot of myself and my aunt in Raimunda. Even Mike liked it, and his usual genre involves gore, chainsaws and Bruce Campbell. Intricate plot, wonderful characters and a shocking ending - nine out of ten. I will be buying this film.

Comments are off

LOVEFiLM Review

07February2008

Yes the dodgy capitals are intentional - it’s how they ’spell’ their company name and since they’re established and all who the hell am I to dispute it. Anyway, LOVEFiLM is an online rental company operating in Europe. They recently caught my attention when they sent me a £50 voucher in the post for three months worth of free rentals - I had signed up at some point in the past presumably.

I thought that it was worth giving a shot, since there’s no local video rental shops around here (the nearest one is more than fifteen minutes away, and with it taking around twenty minutes or so to pick out a video that’s nearly an hour’s worth of just picking a fucking movie - might as well go to the cinema for all that effort).

I was a bit sceptical at first, since I am familiar with these sort of scams where they make you sign up and then you’re contracted for a minimum amount of time whereby you end up paying for all those supposed ‘free’ months you were presumably ‘rewarded’. There were no snags, so I went ahead, compiled a list of DVD’s to rent and waited.

A few days later (literally) my first three DVD’s arrived. One of them was scratched a little but didn’t present a major problem in the overall viewing of the film - although I do hate it when films jump since I like to fully immerse myself in the moment. Anyway, it was free so no complaints. The postage back is free since I was provided with a prepaid envelope so when I was finished I just popped the DVD’s back in and sent them back.

No more than three days later my next lot of DVD’s arrived. Unfortunately one was missing, and another one was pretty scratched - we ended up missing a five to ten minute chunk of the film. Luckily the film wasn’t that amazing, so it didn’t otherwise hinder the experience. The missing DVD arrived separately a few days later - weird!

The monthly fees are very affordable being £15.99 a month to rent three DVD’s at a time as well as having unlimited DVD’s for the entire month. That means if you rent three a week (perfectly feasible) you pay a little over £1 per DVD. Other tariff’s are £9.99 for one DVD at a time plus unlimited for the month and £7.99 for two DVD’s at a time and four lots of rentals a month. Bargain.

Overall I would highly recommend this service, but not without a little caution. I’ve only rented a few DVD’s and already some have not played properly. I’m a total film buff and love watching films so this sort of service is ideal if nothing else. If they pull their finger out and manage to impress me more within my free trial I will seriously consider signing up to them.

If any of you want to sign up, by the way, please reference me :) The website is LOVEFiLM.com and the e-mail I registered with is film@hey-girl.org. Cheers!

Oh and I will be posting reviews soon.

Comments are off
Subscribe