Blasi Blah

Just thought everyone should know, friend and professional race car driver Dean Martin with Ken Wilden and the rest of the Rehagen Racing team won the KONI Challenge Grand Sport race at Leguna Seca this past weekend in the Rehagen Racing #59 car.

From Grand-Am Site: (read full article)

Ken Wilden muscled his way into the lead on the final restart with 16 minutes remaining and held on to pace the final 11 circuits of Saturday’s 79-lap Verizon Festival of Speed, giving the No. 59 Rehagen Racing Ford Mustang GT co-driven by Dean Martin its first Grand-Am KONI Sports Car Challenge Grand Sport victory of the season at Mazda Raceway Laguna Seca.

So I just want to share my way to go and put a Mustang on the top guys, hope to see you at The Glen in June =)

See more about Rehagen Racing and their Skills:

Rehagen Racing Team Site

Grand-Am Team Page

Dean Martin Driver Page

Ken Wilden Driver Page

More effectively known as the Air Show, these shots are from last year’s show.  I wish I could have gone to this years event but they did such a great job of scheduling it on a weekend that was more overcast than last year (not their fault) and on the same weekend as about 10 other events in the area(ok partially their fault).

In any case I have been going to Air Shows at Andrews AFB for years since moving to the DC area in 1989 with my parents. Of course it helped that at the time my father was stationed on the base and we lived there.

For the most part any shot you see that is of a plan flying I can guarantee it was done with my 80-400mm Sigma lens, and everything on the ground was done with the 18-200 Nikor VRII lens. To give you an idea notice in some of the photos you can see the pilot, none of these are cropped, in fact all they have had done to them is re-size them to be more web friendly.

For the planes and jets in flight I slowed down the shutter speed so not to stop the blades, I wanted to insure the look of motion in the photos, obviously this was not a concern with the shots at ground level.  There were a few unfortunately where I did not slow things down enough, oops, guess I’ll just have to remember that next time.

These are shots from the first day of racing at New Jersey Motorsport Park’s Thunderbolt Raceway.  Thankfully this day we did not get any of the rain, there were a few small bursts during some of the other races.

Race was being held at New Jersey Motorsport Park on their Thunderbolt Raceway track. Overall it was a pretty good day, could have done without all the overcast and the occasional rain shower but still had a pretty good time. Track was wet after about half the race and the Viper’s and Corvettes just could not seem to handle that. Overall Andy Pilgrim driving the K-Pax Volvo won the race followed by his teammate in the second K-Pax Volvo and third was taken by the GT500.

I am working on integrating a bubble like this on a site I am building for work so I figured I would share how it is done in case someone else wants to add one or play with it a bit. The original inspiration for this came from Panic’s Coda product site on their “Download” button.

In this case the project calls for a bubble to be shown over an image on the site describing what the image is, and what the action is. If this sounds pretty simple and straight forward well I will try to keep it that way. First do not try to over think it, this is really just a combination of a few effects and timing.

HTML Code:

First before the </head> tag you need to include jQuery


<script type='text/javascript' src='http://yoursite.com/path/to/jquery.js'>
</script>


Now somewhere in the body (really wherever you want the pop up tool tip to show add this code:


<div class="tip-container">
<img class="main-img" src="http://yoursite.com/path/to/img.jpg" />
<div class="popup-tip"> Put the content for the bubble here!</div>
</div>


To explain, the “tip-container” div is used to hold everything together, this is so that you can easily move things around and place it wherever you want in the page. I should also note the reason I am using classes to define this is so that you can have more than one on a given page and you will not have to code multiple styles.

The “main-img” class is the trigger for the effect.

And of course “popup-tip” is the container for anything you want to show in the tip box. This emans you can put any HTML markup you want in there and even style it however you like.

CSS Code:

Next we have the CSS for the block, thie only real goal here is to relatively position the popup and to hide it from initial view.


.tip-container {
position: relative;
}

.popup-tip {
position: absolute;
display: none;
}


There is really nothing more going on here. It is important to set the “popu-tip” display to be none, this is to hide it for those who fear scripts and have them disabled (of course it helps with those using screen readers as well).

JavaScript Code:


$(function () {
$('.tip-container').each(function () {
// options
var distance = 10;
var time = 250;
var hideDelay = 500;

var hideDelayTimer = null;

// tracker
var beingShown = false;
var shown = false;

var trigger = $('.main-img', this);
var popup = $('.popup-tip', this).css('opacity', 0);

// set the mouseover and mouseout on both element
$([trigger.get(0), popup.get(0)]).mouseover(function () {
// stops the hide event if we move from the trigger to the popup element
if (hideDelayTimer) clearTimeout(hideDelayTimer);

// don't trigger the animation again if we're being shown, or already visible
if (beingShown || shown) {
return;
} else {
beingShown = true;

// reset position of popup box
popup.css({
top: -100,
left: -33,
display: 'block' // brings the popup back in to view
})

// (we're using chaining on the popup) now animate it's opacity and position
.animate({
top: '-=' + distance + 'px',
opacity: 1
}, time, 'swing', function() {
// once the animation is complete, set the tracker variables
beingShown = false;
shown = true;
});
}
}).mouseout(function () {
// reset the timer if we get fired again - avoids double animations
if (hideDelayTimer) clearTimeout(hideDelayTimer);

// store the timer so that it can be cleared in the mouseover if required
hideDelayTimer = setTimeout(function () {
hideDelayTimer = null;
popup-tip.animate({
top: '-=' + distance + 'px',
opacity: 0
}, time, 'swing', function () {
// once the animate is complete, set the tracker variables
shown = false;
// hide the popup entirely after the effect (opacity alone doesn't do the job)
popup-tip.css('display', 'none');
});
}, hideDelay);
});
});
});