mancub

Hi Dave, It looks like they have the price set up positioned absolutly over the image and are then using javascript to have the animation for the desciption. I do not know what javascript they are using but you could easily do something pretty similar with the jQuery javascript library. I do not know if you are familiar with the jQuery library but once you have it set up in xhtml and css (essentially you want to start with it looking like it does on hover) then use the jquery command .hide() on the description. Then set up the animation (something like the slide animations in jquery will look like the burton site) to run on hover. Hope that this helps. James

woooooha i fixed it. Was driving me mad finding solutions saying about opacity when i wasnt using it, then i started stripping everything back and found that there was some javascript effecting the menu that shouldn't have been and that was adding opacity. *sigh* Thanks again for the earlier reply and for anyone who read this.

Thanks for your response! Yeah I already have set wmode, the css is layered on top of the flash and working fine other than in FF on mac which is doing the wierd flickery thing.

I am currently working on a project that requires a CSS dropdown menu to go over a flash movie, I have got it all working fine and it looks great. Except, I'm told, if you look at it in Firefox on a Mac, and I do not have a mac so it is driving me insane having to go back and forth to a friend. Unfortunately I cannot post at link at the moment, not helpful I know but I was hoping someone would recognise the problem and point me in the right direction. Basically when you hover over the menu the movie flashes and occasionally disappears. I have read that this can occur if there is an opacity css set on the menu but there is none in this case. I understand that the flash player in mac firefox isn't all that fantastic but I have asked a friend to check another site with a similar layout and it works fine so I am assuming it must be possible. If anyone has even the fainted idea I would be so grateful to hear it!

Hi All, I am a freelance web designer, living and working in Cardiff. I joined the forum initially the other day as I found someone asking for help creating something similar to part of my web site so I offered my advice. I have already found the members to be friendly and interesting and will most certainly be sticking around! Cheers James

Hi Mody glad to hear you got your file size down. I only noticed that you had posted a link to your original one you did in flash last night, sorry must have missed it before. That's looking great and will be all the better if you've got it down to 30-40k, good work!

Thanks Mody, glad you like it and that I managed to help. I think in terms of image optimization photoshop, fireworks or imageready will be able to get your file sizes down, I tweaked a lot of settings trying to get the size down and even now I would like it to be less. As it seems you are developing you skills with HTML/CSS I would definitely recommend the method mentioned by Eris, would love to see what you come up with. @mrbigdog: Yeah Mody is absolutely right about the navigation. It's a really great script, and it is really easy to customise it to make some interesting effects. I am planning to write up a tutorial documenting the changes I made to the style to get it like my navigation and also coming up with some other variations.

Thanks Eris (that wouldn't be an Illuninatus Trilogy reference would it?) Yeah that is a really interesting way of creating the effect, not quiet the effect I was after but certainly something I will find an excuse to use in the future. I love the possibilities of png transparency. Subhajit: I am currently using javascript to achieve png compatibility with the oh so troublesome ie6, I have tried a couple of different versions, but have not come across a solution that allows for repeating backgrounds, especially not in as simple and elegant a form as yours above. Could you tell me if there are any issues in doing it in the way you suggested. I have currently had to resort to different images using conditional comments to get around repeating images in ie6 so would be really interested to know about this. I think that filters do not validate but as this would only be in an ie6 style sheet, if this worked perfectly I think I could live with that!

Hi Mody, That's my site you have pointed to, thanks for visiting I am glad you liked the background. As for how it is made the posters above are more or less right. I used photoshop but I would imagine a similar effect is possible in other software. The image is made using a pattern (I got the image of the pattern from a web site unsure where I think I got there from searching damask patterns on google). Then I made a layer with a lighting effect (filer > render > lighting effect) and set it to overlay. I think i copied this layer a few times and used a few different blend modes, can't remember which I just experimented until it looked nice. When I got it looking how I wanted I added another layer with a radial gradient fill from the dark colour to transparent in the middle so that i could let it blend into the colour from the css background. I have been using PSDTuts [http://psdtuts.com/] as a great resource for tutorials and got a lot of inspiration for the effects there. Sorry if this is a bit rushed, I hope it helps in some way.