What is this feature?

I desire to make a webpage for patio fixtures, I would plan to have an image that has an option box close to it and if the viewer clicks your color, certain furnishings on the image turn compared to that color.

What is that called and how hard is the fact that to do in something like dreamweaver(is that one of the most generally used web site creator still)

Virtually any tutorials for this

We’d personally call the item a swatch pallete as well as colour picker or somethign like this. At a guess it appears like something you’d should prepare in any graphics prog including photoshop, I’m unsure just how Dreamweaver could accomplish that.

I’ve done of which before – basically this is a photo array and clicking to the color loads the particular appropriately colored image. You can undertake it in javascript. Just simply Google " javascript photo swap" and you should find plenty of info and probably the right code snippets to assist you.

Oh so by " To be able to do" I possible the OP hadn’t even got almost any images hence my personal Photoshop comment. Yeah to do it for those who have got the images already is often a Javascript thing because AlphaMare said.

I did a sample page a although ago for another person on one of these forums. http: //www. digitalinsite. ca/development/javascript/ – go you’ll find the site and see if that may be what you’re dealing with. (sorry it took me such a long time to post returning, but it needed me a while to see the example! )

Thank you AlphaMare…. here is a better example of what I would like to do.

With this jcpenney page, you can pick out the color at the bottom and then the shades inside picture will decide on that color. How would I accomplish that in dreamweaver

http: //www3. jcpenney. com/jcp/X6. asp… 1546& cmTypeFlag=RichRel& cmCatID=searchresults

MY SPOUSE AND I haven’t done this specific myself, but the manner I’ve seen the idea done personally is that each of the " color shades" is truly a different picture. They either blast the picture at precisely similar angle with any still camera and also they alter them in Photoshop to color within the affected areas and create a new image.

To ensure the beige would end up being image-1. jpg, the white will be image-2. jpg, etc. From there, you’d must swap the graphics, as AlphaMare reported.

The easy part from the equation is actually the code. The long, tedious, boring part is prepping all the pics.

You might write the value in Dreamweaver, MY SPOUSE AND I guess. But the genuine functionality is because I said before – you need to have a split image for each of the colours. Then for the reason that buttons are clicked, the image changes showing the colour picked out. The JC Penney internet page has added a smaller image that shows onMouseover, with this larger image modifying onClick.

Should you study my case in point, you will make sure the words are very similar to the buttons with the different colours, as well as the images change every time they are moused around. All of your images changes are usually done with javascript. You would like to add an onClick occasion to change a larger image, position all with CSS, and then you’d have what you long for.

Actually, they did it by using Flash. Cheaters.

Effectively, as you understand, I don’t utilize Flash much – it’s very SEO unfriendly, as well as the ROT (Return in time invested in creating it) is quite low. I use it on occasion as a almost costume jewelery to get a site, but you know when they point out " diamonds are a girl’s best friend" that’s REAL ones they’re talking about. Though I suppose only did a great deal of sites with embedded video clip or something which required it specially, I would utilize it more often. But I get javascript is much better for the stuff I can do – menus, image galleries, image swaps – all sorts of fun stuff.

Yep, I know. Friends don’t let good friends use Flash.

This entry was posted in Web Design and tagged , , , , , , , , , , , , , , , , , , . Bookmark the permalink.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *