/    Sign up×
Community /Pin to ProfileBookmark

javascript for image handling

Copy linkTweet thisAlerts:
Aug 12.2003

hello all,

I need to find a script that will help me do the following:

Have one large image (e.g. large1.jpg) and one thumbnail image (e.g. small2.jpg). Whenever I click on the thumbnail, I need to SWAP the images in a way so that in the large area, I will have the second large image (e.g. large2.jpg) and in the thumbnail area, I will have the first small image (e.g. small1.jpg). And if I click again on the thumbnail to return to the initial view (i.e. large1.jpg & small2.jpg) and so on.

I already use a script which replaces a large image with whichever is selected from the thumbnails, but this script requires me to have both thumbnails visible to the user.

I’m probably not making much sense with the above, but if someone thinks it can be done, I’d immensely appreciate any assistance. I’m a bit desperate ?

thank you thank you thank you in advance ?

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@Khalid_AliAug 12.2003 — Nothing tricky in your question ,you just need to cmprehend how the swapping of an image takes polace.Once you have done that then doing what you want is fairly simple.

Here is the link for a very simple image swap.

http://68.145.35.86/skills/javascripts/SimpleImageSwap.html
Copy linkTweet thisAlerts:
@doraauthorAug 12.2003 — thanks khalid...

bits of what I want is in your script, but I can't get the actual swaping between two areas to happen... I've only made it swap one way, but not back again ?

if you have a minute, take a look at what I've done so far:

[URL=http://www.echo-shops.com/script-test/]http://www.echo-shops.com/script-test/[/URL]

the first part works just fine, and I've temporarily used a text link to do the second part... but what I'm looking for is for only one small area to be used for the user to click on (instead of the "reset" text link)... meaning whatever is displayed on the small area, when clicked, to appear in the large area...
×

Success!

Help @dora spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...