-1

I have a Photoshop image that I have created for December 1st. This image will be used as a calendar for an intranet site. Like any normal calendar, it has a door that I wish the user to press. I have a copy of the original document and in place of the door when the user presses this I want to show the new image so it looks like the user has reveled what is behind the door.

I thought I could achieve this task using Photoshop's slice tool. I can achieve this if my calendar door links to a URL, but not another .jpg file.

I also thought I might be able to complete this in Flash by importing my .jpg file and creating a link, but once again I think this is just for URL's.

I know that there is a better way to do this but I am short on time. Would ActionScript in Flash enable me to complete this task?

My original web site that will contain this image is Visual Studio 2005. It has some very basic JavaScript which automatically loads the correct image for each day (since I need 25 of these for the month of December [Day1.jpg, Day2.jpg etc etc]). This works fine. I just need to create the calendar images for each day and the content behind the door.

KatieK
  • 13,586
  • 17
  • 76
  • 90
Betty B
  • 185
  • 1
  • 4
  • 20
  • 1
    Sorry, your question contains a lot of extra information. Mind if we try to clarify a little? It sounds like you have a web page which has a series of images on it. One of these images is a door. When somebody clicks on the image of the door, you want to replace the door image with a new image of an open door. Is that your goal, or is there more to it? Is there a particular reason to mention Photoshop, Flash, Visual Studio, etc? Will a simple JavaScript image swapping script suffice? – Chris Nielsen Nov 27 '12 at 14:17

1 Answers1

1

Yes, a simple actionscript using flash will help you. You can create a document with a button (the button will be the door, you can fill up the background of the button with the door image). Your flash movie may contain 2 keyframes (1 with the default background including the image-button and another keyframe with the image to be displayed when button-pressed). Add some actionscript for the button (basically a GoToAndPlay(# of keyframe with the image) and also a "stop()" action on the image keyframe. Here is a basic example on YouTube Click here. By the kind of thing I guess you want, a little bit of flash animation will make it look better i.e. (door opening clip, 2nd image slide, etc)

As Chris said, a simple JavaScript image swapping code will work too. Here are a couple of examples in StackOverFlow Click Here.

Also you can try some CSS, for example a DIV with the background door and a Hover action that sprite the background to the calendar (click would not be necessary, just hover). Here is a video

I hope any of those solution will work for you, I recommend the CSS one, because it can work with mobile devices, don't require javascript to be enabled, and it's fast and easy.

Community
  • 1
  • 1
Drakell
  • 150
  • 1
  • 10