Preserved Topic: How'd they do this? (Page 1 of 1)

How'd they create the blurry dhtml overlay?

http://carpoint.msn.com/autoshow2001/Sponsor.asp?oem=toyota

Possibly blurOn() and sliding the layer with the blur in it over? I know thats wrong. Just making suggestions.

The Bug Man might know. Does he even come around here anymore? He's a genius.

I really don't know but here is what I think it might be.

I don't think it is a blur effect, I think it is 2 pictures. The sliding part just shows a part of the second picture and the other is a back ground or something. just an idea.


Putting the Green back in Mean... er... wait... DOH!

Fogive my stupidity, if it is, but being that it's a flash movie, would it be DHTML at all?

it took four posts to figure out it is flash? mas medicamentos para todos, por favor...



www.netmosis.com - we're on the leading edge of a false reality...

two pics one fuzzy one not both aligned, the slider is a mask over the fuzzy one...



www.netmosis.com - we're on the leading edge of a false reality...

I got it! Its Flash!

pardon me...for not right clicking

But the slidy part follows the cursor. I didn't know you could do that in Flash. Pretty cool.

Associate Guru
Gurus Network

I have absolutely no clue... But that's smooth as heck. Check out how the "the Toyota 2001 vehicle showcase" varies vertical position according to where in the sliding thing you have the cursor. That's cool.

It's actually pretty simple, you just make a mask that follows the mouse, and reveals a second picture.

It's easy to do in DHTML also. Two DIV's, one containing the unblurred pic, the overlay containing the blurred pic. Move the overlay on the mousemove event while at the same time repositioning (and clipping) the blurred picture within the overlay DIV to the correct X coordinate for display.

Jaysus, did that even make sence....

ocb - reading that made my brain hurt.

I think it's tutorial time!

Pat Richard
Web weenie
http://www.gurusnetwork.com
ICQ 23113317

I cannot open the page.





Share your knowledge. It's a way to achieve immortality.

Ahh bored at work.
http://www.bitdamaged.com/testpages/effect/

Pugz I'll simplify this a bit and make a tute.

ocb. I didn't actually need to move the layers (thought I would though at first) Instead I just moved the clip around.

But ... If I wanted content in the window I would need an embedded div that followed the clip area.


Walking the Earth like Kane

[This message has been edited by bitdamaged (edited 01-25-2001).]

[This message has been edited by bitdamaged (edited 01-25-2001).]

couldn't you just fix that with a parent layer that hides everything outside it?

tskull@techie.com">
"War is a series of disasters which result in a winner." --Georges Clemenceau
ICQ: 67751342

see how stupid questions can get people thinking....

Umm.

Not sure the question.

But It made me think I could add a 3rd layer z-indexed on top of the other 2 that is as wide as the clipped area and follows the same path.

Lemme try it.


Walking the Earth like Kane

aw hell, just buy Flash

There's another level of complexity to consider: the type that follows the cursor on the y axis, constrained within the blur mask, which follows on the x axis. Oh yeah, and then the menu items at the bottom that highlight!

Someone must have a extension for Dreamweaver that makes this happen in two clicks!

The rest of the site was pretty slick too. Oh yeah - Flash lets you capture mouse coordinates and do tricks with that info. It's kind of a toss up - DHTML and risk having it fail on incompatable browsers, or Flash and risk having it fail with absent plugins.

[This message has been edited by Steve (edited 01-26-2001).]

this and the OK Slime threads are ablaze with knowledge I must say. Keepers.

You can never win.

I would think that doing it the DHTML (javascript) way would be a better option. I am sure that it is a much faster load! My stats show that 8% don't have javascript enabled. That is a largish margin of error. Don't have any stats on Flash though.