Solved

1click,2effects/Frame photo-album

Posted on 2004-08-15
9
299 Views
Last Modified: 2007-12-19
Hi, I'm tryin' to create a simple picture album in frames A,B & C.
A frame= menu, contains thumbnails;
B frame= main pic display window when clicks made in 'A' frame;
C frame= should display picture description.
In short, 1 click on thumbnail, displays picture in 'B' and it's description in 'C'.

I could get A & B, but not C.
Any tips will be awesome! Thanks!

0
Comment
Question by:tenzinmin
  • 5
  • 3
9 Comments
 
LVL 8

Expert Comment

by:klykken
ID: 11804561
Hiya tenzimin,
It would be nice to see your current code, then at leaqst we know what needs to be done.

On another note: Are you really sure you want to use frames for this? It's an archaic html technology that is replaced by server side technologies for the most part years ago.

-klykken
0
 

Author Comment

by:tenzinmin
ID: 11804654
Hi Klykken,
Following code is placed in iframeA.

<a href="picture1.jpg" target="iframeB" >
<img border="1" src="pic1thumnail.jpg" width="100" height="67"></a>

When the 'pic1thumbnail'  is clicked, the real picture displays in iframeB. What I need is a special 'tag' or 'code', something that could generate the picture description in 'iframeC' w/ that one same click.

I know following codes wouldnt work..just an idea..

<a href="picture1.jpg" target="iframeB" a href="description.html" target="iframeC'>
<img border="1" src="pic1thumnail.jpg" width="100" height="67"></a>

Af forme, frames looks lil' easier then javas..  :) Thanks!
0
 
LVL 8

Expert Comment

by:klykken
ID: 11804703
Just add a little javascript to your link like this:
<a href="picture1.jpg" target="iframeB" onClick="parent.iframeC.location='description.html'">
<img border="1" src="pic1thumnail.jpg" width="100" height="67"></a>

-klykken
0
 
LVL 8

Expert Comment

by:klykken
ID: 11804817
Hiya COBOLdinosaur!
Coming from you, that greeting actually means something :-) I've been away for a while, but I guess I'm back now.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 

Author Comment

by:tenzinmin
ID: 11804893
That was helpful..u rock!..hehe..okay..I'll increase the points by 50 more and ask one related question:
I dont wanna make 50 different description pages for my 50 pix, I'd rather make one page and have all description interconnected. Eg: http://www.htmlcodetutorial.com/frames/noframesrecipes.html
Where they use this sign '#' to link the description. But I dont want user to click many times. So user should click a thumbnail, & gets the real picture1 + exact #description1. Can you help me on this? Thanks!
0
 
LVL 8

Accepted Solution

by:
klykken earned 150 total points
ID: 11804942
hi tenzomin,
This is actually a great example of why you should'nt use frames :-) This gets overcomplicated. Html pages should be *one* page (in my world anyways). But enough of my rant, let's see if we can hack our way through this soyou can make your frames to work :-)

First of all you need to insert an anchor inside your description.html right before each description starts, like this:
<a name="desc1"></a>
Description 1 etc etc
<a name="desc2"></a>
Description 2 etc etc
<a name="desc3"></a>
Description 3 etc etc

Now you need to change your thumbnail links to this, so that each link will link to the correct anchor in your (now) looong description page:

<a href="picture1.jpg" target="iframeB" onClick="parent.iframeC.location='description#desc1.html'">
<img border="1" src="pic1thumnail.jpg" width="100" height="67"></a>

<a href="picture2.jpg" target="iframeB" onClick="parent.iframeC.location='description#desc2.html'">
<img border="1" src="pic2thumnail.jpg" width="100" height="67"></a>

<a href="picture3.jpg" target="iframeB" onClick="parent.iframeC.location='description#desc3.html'">
<img border="1" src="pic3thumnail.jpg" width="100" height="67"></a>

etc

You get the point :-)

-klykken



0
 

Author Comment

by:tenzinmin
ID: 11805136
Hey Klykken! I dunno wut 2 say..you're jst GrRrrEaATT!! haha.. it worked!! Only thing I had to fix is..

onClick="parent.iframeC.location='description#desc1.html'

..into...(moved .htm in front....)

onClick="parent.iframe3.location='description.htm#desc3'">

Thank you so much! hope to c ya again! haha!! TekKare!
~Tenzin
0
 
LVL 8

Expert Comment

by:klykken
ID: 11805160
oops my mistake..
Good job figuring out what to change in my code though :-)
Good Luck with your photoalbum!

-klykken
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Max-width on individual images in grid 4 52
iframe detection of parent window scale 20 60
form button worked now it doesnt anymore 9 41
html input type 3 22
Showing your events from Google Calendar in Google Maps Why? I travel all week and I thought it would be ideal if staff in office knew where I was based on my calendar. (OK real reason: my son wanted to see where I would be working, and I thoug…
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now