How to make this one?

Discussion in 'HTML & Website Design' started by SEO Expert!, Mar 26, 2011.

  1. #1
    Hello,
    can some body help that i want to create a dynamic box, i am showing screen shot example below.
    When our mouse goes on different buttons, the image show and stop of the button which on our mouse.
    See the web example. seo.com
     

    Attached Files:

    SEO Expert!, Mar 26, 2011 IP
  2. sarahk

    sarahk iTamer Staff

    Messages:
    28,846
    Likes Received:
    4,542
    Best Answers:
    123
    Trophy Points:
    665
    #2
    In the old days we used image maps. these days I'd probably slice the image up and make parts clickable images.
     
    sarahk, Mar 27, 2011 IP
  3. GoNetix

    GoNetix Peon

    Messages:
    17
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    You can use layering and css (positioning, hover) to achieve what you want... take a look at http://netix.ca (.co) and follow the header source code.

    Header graphic consists of 4 layers including 'order now' button with css exact positioning and hover fade...
     
    GoNetix, Mar 27, 2011 IP
  4. SEO Expert!

    SEO Expert! Peon

    Messages:
    16
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Ok thanks. But can anybody give me the complete method to create this?
     
    SEO Expert!, Apr 2, 2011 IP
  5. seagate

    seagate Banned

    Messages:
    162
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #5
    If i am correct with im not quite sure if i am you can do this if you have the PSD's in photoshop, You export it as a web document etc and splice it, you splice each individual image you want to be clicked on, open the .html or .php in dreamweaver and then in the css fine what the image name is for example "casestudy.jpg" and then you'll have to put some code in which im not sure exactly what it is, but when you click it you can have it change that image , or you can have it so you click on it and it goes to another page aka <a href="#"><img src="#"></a>
     
    seagate, Apr 2, 2011 IP