My jQuery mini logo

The other night I wanted to add a mini ‘Daniel Stuart’ logo on my site’s top navigation bar. The idea was that this would maintain my branding but the real magic is to only show the mini logo once the user scrolls passed the large logo.

A look at the xHTML

Below is a look at the xHTML placed in the top bar. I have set the display to none so it does no show up initially.

<div id="miniLogo" style="display: none">
	<a href="http://danielstuart.ie">
		<img src="images/miniLogo.png" alt="Daniel Stuart"/>
	</a>
</div>

jQuery to the rescue

I have used scrollTop() to determine how far down the user has scrolled. According to my template design, I want the logo to fade in when the user has scrolled down 100 pixels or more. Also, I want the logo to fade away when the user scrolls back up to the top.

I have set up a boolean variable to check it the user has scrolled past the main logo as I only want to initiate fadeIn and fadeOut once.

I also used jQuery.noConflict(); to avoid any issues with any other scripts I am using.

var $scrolled = new Boolean(false);
jQuery.noConflict();
jQuery(window).scroll(function () {
	position = jQuery(window).scrollTop();
	if(position >=100 && $scrolled == false){
		$scrolled = new Boolean(true);
		jQuery('#miniLogo').fadeIn('slow', function() { });
	}else if(position <100 && $scrolled == true){
		$scrolled = new Boolean(false);
		jQuery('#miniLogo').fadeOut('slow', function() { });
	}
});

So check it out above, scroll down a bit past the main logo and watch the magic happen!

Adobe After Effects Earth Zoom from Dun Laoghaire Marina

Decided to do another one of those tutorials from VideoCopilot. This time I attempted the earth zoom. I took some snapshots of Google Earth at various altitudes and in the tutorial you are shown how to put these all together and create the effect.  The zoom starts at Dun Laoghaire Marina and pulls out to space. Enjoy!

httpvh://www.youtube.com/watch?v=bwEwCJSL1pY

Here’s the Marina on Google Maps


View larger map

Adobe After Effects Particle Explosion Title HD

Decided to spend a few hours this evening mucking about with Adobe After Effects. I headed over to VideoCopilot.net and came across this title tutorial. He’s got some really nice tutorials up there and he talks you through every step. Just make sure you have the pause button ready and alt+tab back and forth from your browser of choice to After Effects!

httpvh://www.youtube.com/watch?v=yHNcZdeHyxU

New Zealand Scrolling Panoramas

I recently put put together 10 panoramas from around New Zealand with Photoshop’s photomerge automation. This is a great tool for putting these shots together if your camera doesn’t have an in built panorama mode. I have a basic digital camera too (FUJIFILM FinePIx Z20fd) so I’m happy to get some impressive amateur panoramic photos from it. Continue reading “New Zealand Scrolling Panoramas”

Dun Laoghaire Band Stand – 3D

Old Dun Laoghaire Bandstand
Old Dun Laoghaire Bandstand

I made this back in 2004 for an old college project. Its a model of what the old Band Stand in Dun Laoghaire used to look like. It has recently been knocked down and rebuilt.

I’m by no means a 3D artist or anything. We had a module in 2nd year and we did some 3D Studio Max work for a few months.

httpv://www.youtube.com/watch?v=6ibUxDnCedc

Web work in New Zealand

Since living in New Zealand for the guts of 7 months I have managed to get a little bit of web development work here and there. Back in Queenstown I did some freelance work for local web development company, Kelpdesign. They took me on for a few weeks and I managed to get a few site’s done for them. Nice bunch of people and I’ll never forget William’s two dogs lounging around the office in front of the gas heater.

The first bit of work was a simple WordPress website for a local tradesman. They were looking for something quick and it was basically a free theme, some plugins and some content put together.

www.queenstownconcretegrinding.com
www.queenstownconcretegrinding.com

The second website on the other hand was a custom design by Kelpdesign and it was for a local construction project management company. I had to convert it to xHTML and CSS and set it up as a WordPress template. This was the first time I have created a template for WordPress and it really opened me up to what WordPress could do. I have created so many templates for Joomla in the past and developing one for another CMS was pretty interesting. This WordPress template had everything from custom fields and separate layouts that could be assigned to specific pages and categories. As well as clever bits of PHP and nice usage of WordPress’s API.

www.triplestar.net.nz
www.triplestar.net.nz

Old College Project made with Macromedia Director

Back in 2002 – 2006 I studied Multimedia Programming/Multimedia Systems at the Institute of Art Design and Technology in Dun Laoghaire, Dublin,  Ireland. The course taught us how to use many multimedia applications, one relic being Macromedia Director. Oh where is it now? Well taken over by Adobe for a start 🙂

For my final year project, I studied the differences between 2D and 3D simulations. I had to write a pretty large paper and create an application to demonstrate my findings. The amount of hours I put into this project would be far too many to count. Its a pity nobody uses Director anymore!

traffic-simulation-project

For my project I decided to focus on traffic simulation and I created this little interactive application. You’ll most likely need to install Adobe Shockwave to get this running! You can view junctions in 3d or 2d ( which was just a top down 3D view ), increase traffic density, rotate camera view in 3D and increase building height.

Its flawed I know, the cars turn into each other sometimes and the 2D view isn’t even true 2D, but lets just put that all aside!

Does anybody use Director anymore? let me know and post any links to anything you’ve developed with it!